原生js导航栏上滑隐藏,下滑显示

原生js导航栏上滑隐藏,下滑显示
// 上下滑动筛选栏显示隐藏
var windowTop=0;
$(window).scroll(function() {
    let scrollS = $(this).scrollTop();
    let selBtn = document.querySelector('.sel-btn');
    if(scrollS>=windowTop){
        selBtn.style.opacity=0; // 上滑时要做的事(隐藏)
        windowTop=scrollS;
    }else{
        selBtn.style.opacity=1; // 下滑时要做的事(显示)
        windowTop=scrollS;
    }
});
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,195评论 4 61
  • 看过斗鱼 APP 的首页上滑隐藏导航,下滑显示导航效果很流畅,使用效果非常不错原理:UItableView或 UI...
    _水畔竹汐阅读 5,474评论 0 3
  • 我是一名新入门的学生,用Android studio运行一个自己编译的app可是运行不起来,有谁帮帮我嘛?拜托拜托
    扎心的默儿阅读 1,261评论 0 0
  • 年初三,全家按照惯例要去大伯家拜年。其实大家都知道,他已从趾高气昂的艺术家,变成了白发苍苍,每天靠练字消磨...
    姜小莱阅读 1,703评论 0 1
  • 文|冰千里 想要过上真正有价值的生活 对他人充满悲悯 对周围一切心怀挚爱 唯一的途径就是去觉知 觉知当下所经历的一...
    冰千里阅读 4,500评论 32 25