6

ドキュメントウィンドウの幅の400％にまたがるoverflow：autoコンテナがあります。したがって、ページに水平スクロールバーがあります。また、このコンテナ内には、左側の位置が異なる複数のdivがあります。コンテナをクリックするときに、各コンテナの左側の位置を取得する必要があります。$（this）.offset（）。leftを使用しますが、これにより、コンテナーdivの左オフセットが0pxになり、$（this）.position（）。leftを使用しましたが、同じことがわかります。 .. 助言がありますか？

マークアップは次のようになります。

<div id='scroll'>
 <div id='content'>
   <div class='container' rel='1'></div>
   <div class='container' rel='2'></div>
   <div class='container' rel='3'></div>
   <div class='container' rel='4'></div>
 </div>
</div>

css

#scroll{
   position:absolute;
   width:100%;
   height:95%;
   overflow:auto;
   }
#content{
   float:left;
   height:100%;
}
.container{
   height:100%;
   float:left;
   }

jquery

 var iMaxSize = $(".container").size();
 $("#content").css({width: $(document).width()*iMaxSize +'px' });
 $(".container").css({width: $("#content").width()/iMaxSize +'px' });
4

5 に答える 5

4

このように、コンテナ要素のスクロール位置を使用できます。

$('#container .element').offset().left - $('#container').offset().left + $('#container').scrollLeft();

ここでJSFiddleを参照してください

于 2015-06-25T12:05:00.353 に答える
1

position()オフセットに問題がある場合は、オフセットの代わりに使用してください。スクロールするオブジェクトのwidth（）を使用して、それを説明します。もちろん、IDや状況に合ったものを使用するようにセレクタータイプを変更できます。

$('.class for container div')
     .animate( { scrollLeft: 
         $('.class for you want to scroll to').position().left - 
         $('.class for you want to scroll to').width() }
     ,'slow');
于 2017-10-18T18:17:24.673 に答える
0

このようなことを試しましたか...

$('#id').width();
于 2011-06-19T02:00:51.037 に答える
0

私は以前にそれを使用したことはありませんが、scrollTopと同様に機能すると思います-scrollLeft（）を見てくださいスクロールが発生する前に要素の開始scrollLeft位置を見つけてキャッシュする必要があります-その後スクロール後に取得した新しいscrollLeft位置からそれを減算します。

編集待って、offset（）が機能していませんか？動作しているはずです。

于 2011-06-19T02:16:04.510 に答える
0

なんらかの理由で、.offset（）を正常に動作させることができないため、またはscrollLeft（）を実行できません。私はちょうどこれを非常にラウンドな方法で行うことにしました。

 $('.container').click(function(){
     var num = parseInt( $(this).attr('rel') );
     var left = $('.container').width() * num-1;
     var top  = $('.container').css('top');
     //do something with these values
 });
于 2011-06-27T12:21:55.810 に答える