javascript - 手机端，js固定层的问题

Question

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

我的思路：滚动值小于该层距离顶部的偏移高度时，改层就加（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');                    
        }
        
    });    

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

Answer 1

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

github上搜一下关键字：

• https://github.com/garand/sticky

• https://github.com/filamentgroup/fixed-sticky