10

開始と終了の間の要素のスクロールバーでカバーされる「距離」のパーセンテージをどのように計算できますか？

<div id="container" style="overflow-x:scroll; max-width:1000px;">
  <div id="contained" style="width:3000px;"></div>
</div>

<script>
  $('#container').scroll(function(){
    var scrollPercentage; //How to get scroll percentage?
  });
</script>

したがって、スクロールバーが完全に左側にある場合はを取得0し、完全に右側にある場合はを取得します100。

4

2 に答える 2

27 
var scrollPercentage = 100 * this.scrollLeft / (this.scrollWidth-this.clientWidth);

http://jsfiddle.net/vWDfb/3/

または、本当にjQueryを使用する必要がある場合：

scrollPercentage = 100 * $(this).scrollLeft() / ($('#contained').width() - $(this).width());

http://jsfiddle.net/vWDfb/5/

于 2012-08-31T21:11:50.860 に答える
4

ここでそれを参照してください：http：//jsfiddle.net/vWDfb/1/

$('#container').scroll(function(){
    var scrollPercentage = 100*this.scrollLeft/this.scrollWidth/(1-this.clientWidth/this.scrollWidth);
});

その数値を、たとえば小数点以下2桁に丸めると便利な場合があります。次に、

scrollPercentage.toFixed(2);

編集：より良い使用

var scrollPercentage = 100 * this.scrollLeft / (this.scrollWidth-this.clientWidth);

@Blazemongerが指摘したように。

于 2012-08-31T20:59:15.103 に答える