javascript jquery水平スクロールコンテナの要素の左位置を見つけよう

Question

私は、ドキュメントウィンドウの400％の幅に及ぶオーバーフロー：自動コンテナを持っています。したがって、私のページには水平スクロールバーがあります。私はまた、異なる左の位置でこのコンテナの中に複数のdivを持っています。私はそれらをクリックするごとに各コンテナの左の位置を取得する必要があります。私は$（this）.offset（）。leftを使用しますが、これはコンテナdivの左オフセットを0pxにして、$（this）.position（）を使用しました。 .. 助言がありますか？

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

<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' }); 

Answer 1

何らかの理由で私はまだ、それが必要なやり方や、scrollLeft（）のために.offset（）を得ることができません。私はちょうどこれについて非常にラウンドについてこれを行うことにしました。

$('.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 
}); 

Answer 2

あなたはこのような何かを試してみました...

$('#id').width(); 

Answer 3

私はこれまで自分で使っていませんが、scrollTopと同様に動作すると思います。scrollLeft()スクロールが発生する前にスクロール位置を見つけてキャッシュしてくださいスクロール後に取得された新しいscrollLeft位置からその値を減算します。

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

Answer 4

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

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

参照JSFiddle here

Answer 5

利用position()代わりのオフセットで問題が発生した場合のオフセット。 スクロールするオブジェクトの幅（）を使用して、それを考慮します。 もちろん、あなたの状況に合った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');