手机端,js固定层的问题

发布于 2022-09-01 18:34:42 字数 956 浏览 19 评论 0

需求:当滚动到某个层后,该层就固定在可视窗体上,滚动回去,则不固定在窗体上。

我的思路:滚动值小于该层距离顶部的偏移高度时,改层就加(position:fixed),否则就加上

问题: 在手机上运行时,当向上滚动的过程中就会出现这个问题
图片描述

当滚动结束后才会恢复正常,如下图
图片描述

在pc端用谷歌浏览器模拟的时候没什么问题

哪位大侠有遇到过这问题吗?

//首页底部分类固定

    var _vNavH = $('.pLeft').offset().top; //获取固定层离页面顶部的偏移高度值
    var _scroll;

    //滚动方法        
    $(window).scroll(function() {
        _scroll = $(document).scrollTop();    
        
        //当滚动高度大于该层,就让它处于固定状态
        if(_scroll > _vNavH){
            $('.pLeft ul').addClass('pLeftUlFixed');
        
        }else{
            $('.pLeft ul').removeClass('pLeftUlFixed');                    
        }
        
    });    

在微信上会出现这问题,在手机浏览器上又是正常的

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

自控 2022-09-08 18:34:42

iOS 使用 position:sticky,Android的话JS模拟可以实现。

github上搜一下关键字:

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文