微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

JQuery在底部检测滚动

用户滚动到页面底部时,我希望实现内容加载。

我有一个问题。它在桌面浏览器上工作正常,但不能在移动设备上运行我已经实施了一个肮脏的修复,使其在iPhone上工作,但不是最佳的,因为它将无法在其他大小的移动设备上工作。

我的网站是www.cristianrgreco.com,向下滚动以查看效果

问题是添加滚动,高度不等于移动设备的高度,而他们在桌面浏览器上。

有没有办法检测移动浏览器?

提前致谢。

以下是当前使用的代码

$(document).ready(function () {
        $(".main").hide().filter(":lt(3)").show();
        if ($(document).height() == $(window).height()) {
            // Populate screen with content
        }
        else if (navigator.userAgent.match(/Android/i) || navigator.userAgent.match(/webOS/i) || navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i)) {
            window.onscroll = function () {
                if ($(document).height() - $(window).scrollTop() <= 1278) {
                    // At the moment only works on iPhone
                }
            }
        }
        else {
            $(window).scroll(function () {
                if ($(window).scrollTop() + $(window).height() >= $(document).height()) {                     
                    // Works perfect for desktop browsers
                }
            })
        }
})

解决方法

对于稍后查看的人,我通过将Meta = device-height添加到元视口标签解决这个问题:
<Meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0">

然后,您可以继续使用$(document).scroll(function(){});

这适用于iOS 5

原文地址:https://www.jb51.cc/jquery/182430.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐