根据目标位置
问题描述:
我试图触发/允许当窗口滚动条的底部已经达到了目标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;
答
这似乎符合我的需求,可以帮助他人。如果在计算中将目标容器替换为pageHeight
,则当窗口滚动条到达目标位置而不是页面底部时,无限滚动将被触发。
// 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();
}
});