移动端上滑加载更多

原理:
scrollHeight即真实内容的高度;

clientHeight比较好理解,是视窗的高度,就是我们在浏览器中所能看到内容的高度;

scrollTop是视窗上面隐藏掉的部分。

1 如果真实的内容比视窗高度小,则一直加载到超过视窗,
2 最直接的判断不就是 :scrollTop+可视部分(设备高度)==文档(真是高度)就是滑到了底部了。




// 给layui的table增加下拉到底部的判断

document.getElementsByClassName("layui-table-body")[0].onscroll = function(){
    var scrollTop = this.scrollTop,//页面上卷的高度
        wholeHeight = this.scrollHeight,//页面底部到顶部的距离
        divHeight = this.clientHeight;//页面可视区域的高度
    // 到底部
    if(scrollTop + divHeight >= wholeHeight){
        // do
    }
    //到顶部
    if(scrollTop==0){
        // do
    }
}
// 设置滚动元素的y轴位置
document.getElementsByClassName("layui-table-body")[0].scrollTop = 600;

你可能感兴趣的:(移动端上滑加载更多)