咨询电话:
15628812133
19
2017/01

网站列表页的下拉底部实现加载更多的做法

发布时间:2017-01-19 09:25:16
发布者:xiangpeiyu
浏览量:
0

        在做手机网站,为了更好的用户使用,通常不会用到带页码块的分页去做列表页,以便在用户点击时不会去按特别小的页码去实现浏览每页,所以这里用到了ajax实现的下拉加载更多的做法,接下来,就是讲解如何去实现这个效果:

    //在做之前建议先引入jquery框架库
    $(window).scroll(function () {
          //第一步,通过jquery获取windows对象,创建一个滚动事件
        var scrollTop = $(this).scrollTop();
        //第二步,$(this)指的就是当前window对象,
        获取window对象滚动条在Y轴上的滚动距离
        var scrollHeight = $(document).height();
        //第三步,获取文档对象的高度
        var windowHeight = $(this).height();
        //第四步,获取window对象的高度
        if (scrollTop + windowHeight == scrollHeight) {
            从这个三个变量的介绍就可以看出来,滚动条到底部的条件即为scrollTop + clientHeight == scrollHeight。(兼容不同的浏览器)。
      //此处是滚动条到底部时候触发的事件,在这里写要加载的数据,或者是拉动滚动条的操作,下一篇将讲实例操作如何,请期待....


        }
    });


关键词:
返回列表