Question

我有这个功能，当用户距离窗口底部500px时会触发一次点击。

一切正常，除非我将html和body设置为高度：css为100％。

在这里工作＆＃39;脚本。

$(document).ready(function() {
    var timeout = '';
    $(window).scroll(function (e) { 
        var intBottomMargin = 500; 
        clearTimeout(timeout);
        //if less than intBottomMargin px from bottom 
        if ($(window).scrollTop() >= $(document).height() - $(window).height() - intBottomMargin) {
          timeout = setTimeout(function(){ 
                $("#next-paginav")[0].click(); 
          }, 300);
        }
    });
});

当我的html和正文高度为100％时，如何使相同的脚本工作？

我确定这很简单。

Answer 1

我认为您的计算不正确：

if ($(window).scrollTop() >= $(document).height() - $(window).height() - intBottomMargin)

如果您的body / html的高度为100％，则表示您将其设置为视口的高度。你之前有浮动元素吗？这可能就是你（之前的）高度计算工作的原因

请改为尝试：

if ($(window).scrollTop() >= $(document).height() - intBottomMargin)

Answer 2

您滚动的内容不是window，因为body和html设置为与窗口大小相同，因此窗口没有溢出需要scollbar

Scrollbar是正文的一部分，因为它有溢出内容。将scoll处理程序绑定到正文并且可以正常工作

 var $scollEl=$('body').scroll(function (e) { 
        var intBottomMargin = 500; 
        clearTimeout(timeout);
        //if less than intBottomMargin px from bottom 

        if ($scollEl.scrollTop() >= $(document).height() - $scollEl.height() - intBottomMargin) {
          timeout = setTimeout(function(){ 
                $(".clicked").click(); 
          }, 300);
        }
    });
});

演示：http://jsfiddle.net/LnmsR/2/

jquery问题与html高度：100％

2 个答案: