0

最近、jQueryを使用して水平方向のページの高さのプログレスバーを作成する方法を尋ねられました。これはhttp://www.piccsy.com/investors/に似ています。私は周りを見回しましたが、Google検索と古いjQueryプラグインライブラリの両方で何も見つかりませんでした。

この効果をどのように達成できるか知っている人はいますか？$（'＃containerDiv'）。scrollTop（）と関係があると思いますが、そのメソッドに精通していません。

4

1 に答える 1

0

あなたはscrollTop（）;を使用して正しかった。

これはウィンドウの高さを使用した例ですが、コンテナdivに簡単に適用できます。

$(document).scroll(function(){
var theDistance =  $(window).scrollTop(),
      theHeight = $(document).height(),
  heightPercent = theDistance/theHeight*100;

  console.log(heightPercent);

});

例を参照してください：http：//jsbin.com/ikakim/1/edit

これにより、スクロール領域の上部からの距離がパーセントでブラウザコンソールに記録されます。したがって、半分下がっている場合、heightPercentは「50」になります。ここから、水平線の幅などを合計サイズの50％に設定できます。

スクロールバーの高さにより、下部（現在は最大97までログ）を押すときに問題が発生する可能性があることに注意してください。

于 2012-08-09T14:07:00.570 に答える