ターゲット位置に基づいて無限スクロールをトリガーする

Question

ウィンドウのスクロールバーの下端がターゲットdivの位置に到達したときに、新しい画像をロードする/トリガーしようとしています。

ここでは、スクロールバーがわずかにオフセットされたページの下端に達したときにトリガする式を示します（50ページ）。

$(window).scroll(function() { 
    // Page height 
    var pageHeight = $(document).height(); 
    // Window height 
    var winH = $(window).height(); 
    // Scrollbar position 
    var scrollPos = $(this).scrollTop(); 
    // Formula 
    var dist = pageHeight - (scrollPos + winH); 
    // When to load new images with a slight offset 
    var load = dist < 50; 
    if (load) { 
     addItems(); 
    } 
}); 

しかし、私は計算/式が必要とされているものを対象div.infinite-scrollの位置を使用する代わりに場合は？私は、50の代わりに目標divのオフセットを代用できると思ったが、私にとってはうまくいかなかった。

var targetPos = $(Infinite_Scroll.container).offset().top; 
var load = dist < targetPos; 

Answer 1

これは私のニーズに対応していて、他人を助けることができるようです。計算でpageHeightのターゲットコンテナをInfiniteスクロールと置き換えた場合、ウィンドウのスクロールバーがページの下部ではなくターゲットの位置に到達すると、スクロールがトリガされます。

// Before 
var dist = pageHeight - (scrollPos + winH); 
// Change 
var dist = $(Infinite_Scroll.container).offset().top - (scrollPos + winH); 

$(window).scroll(function() { 
    // Page height 
    var pageHeight = $(document).height(); 
    // Window height 
    var winH = $(window).height(); 
    // Scrollbar position 
    var scrollPos = $(this).scrollTop(); 
    // Formula 
    var dist = $(Infinite_Scroll.container).offset().top - (scrollPos + winH); 
    // When to load new images with a slight offset 
    var load = dist < 50; 
    if (load) { 
     addItems(); 
    } 
});