用户滚动当检测到使用jQuery的div的底部

我有一个div框(称为通量)里面的内容的变量数量。 这divbox已溢出设置为自动。

现在,我所要做的,就是当使用滚动这个DIV盒的底部,加载更多的内容到页面,我知道如何做到这一点(加载内容),但我不知道如何发现当用户滚动到div标签的底部? 如果我想这样做对整个页面,我会采取.scrollTop并减去从.height。

但我似乎无法在这里做什么?

我试着从流量采取.scrollTop,然后包装了一个名为内的div里面的所有内容,但如果我走流量的innerHeight返回564px(在div被设置为500为高度)和“肠子”的高度它返回1064,和scrollTop的,在div的底部时说:564。

我能做什么? :•

谢谢! :)

--------------解决方案-------------

有一些属性/方法可以使用​​:

$().scrollTop()//how much has been scrolled
$().innerHeight()// inner height of the element
DOMElement.scrollHeight//height of the content of the element

所以,你可以把前两个属性的总和,而当它等于最后一个属性,你已经达到了目的:

jQuery(function($) {
$('#flux').bind('scroll', function() {
if($(this).scrollTop() + $(this).innerHeight() >= this.scrollHeight) {
alert('end reached');
}
})
});

http://jsfiddle.net/doktormolle/w7X9N/

我发现了一个解决方案,当你从滚动底部显示一个div你的窗口,并最终给你一个警告。

$(window).bind('scroll', function() {
if($(window).scrollTop() >= $('.posts').offset().top + $('.posts').outerHeight() - window.innerHeight) {
alert('end reached');
}
});

INT如果你向下滚动时格(.posts)完成他的榜样它给你一个警告; 遗憾的坏写作;

这里只是一个额外的音符,因为我发现这个寻找一个固定的div,我想滚动一个解决方案时。 对于我的方案,我发现它的最好考虑填充的分区,所以我可以准确地打到最后。 所以@ Dr.Molle的回答扩​​大对我添加以下

$('#flux').bind('scroll', function() {
var scrollPosition = $(this).scrollTop() + $(this).outerHeight();
var divTotalHeight = $(this)[0].scrollHeight
+ parseInt($(this).css('padding-top'), 10)
+ parseInt($(this).css('padding-bottom'), 10)
+ parseInt($(this).css('border-top-width'), 10)
+ parseInt($(this).css('border-bottom-width'), 10);

if( scrollPosition == divTotalHeight )
{
alert('end reached');
}
});

这会给你的确切位置,包括填充和边框

这个工作对我来说,虽然

$(window).scroll(function() {
if ($(window).scrollTop() >= (($(document).height() - $(window).height()) - $('#divID').innerHeight())) {
console.log('div reached');
}
});

分类:JavaScript的 时间:2015-03-16 人气:89
本文关键词: JavaScript中,jQuery的
分享到:

相关文章

Copyright (C) 55228885.com, All Rights Reserved.

55228885 版权所有 京ICP备15002868号

processed in 0.406 (s). 10 q(s)