实现这个功能和三个dom元素有关系 1。clientHeight 占用空间的内容,不包括滚动条没滚到的地方。 2。offsetHeight 内容的高度,包括滚动条没滚到的地方 3。scrollTop 滚动条可以动的长度 所以 我们拉动滚动条,从最上面拉到最下面,变化的是scrollTop的值,而这个值是有一个区间的。 这个区间是: [0, (offsetHeight - clientHeight)]
如果要实现拉到底部自动加载内容。只要注册个滚动条事件:
scrollBottomTest =function(){
$("#contain").scroll(function(){
var $this =$(this),
viewH =$(this).height(),//可见高度
contentH =$(this).get(0).scrollHeight,//内容高度
scrollTop =$(this).scrollTop();//滚动高度
//if(contentH - viewH - scrollTop <= 100) { //到达底部100px时,加载新内容
if(scrollTop/(contentH -viewH)>=0.95){ //到达底部100px时,加载新内容
// 这里加载数据.
}
});
}
转载请注明源地址: http://techfoxbbs.com/forum.php?mod=viewthread&tid=460&page=1&extra=#pid479
|
实现微信一样下拉加载朋友圈
最新推荐文章于 2021-06-03 23:19:23 发布