鼠标往下滚动,导航栏固定在最顶部

JavaScript 专栏收录该内容
3 篇文章 0 订阅
window.onscroll = function(){
    var topScroll = getScrollTop();//滚动的距离,距离顶部的距离
    var bignav = document.getElementById('bignav');
    if (topScroll > 150){          //滚动的高度
        bignav.style.position = 'fixed';
        bignav.style.top = '0';
        bignav.style.zIndex = '1000000';
    } else {
        bignav.style.position = 'static';
    }
};
function getScrollTop(){
    var scrollTop;
    if(typeof window.pageYOffset != 'undefined'){             //pageYOffset指的是滚动条顶部到网页顶部的距离
        scrollTop = window.pageYOffset;
    }else if(typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat')        {
        scrollTop = document.documentElement.scrollTop;
    }else if(typeof document.body != 'undefined'){
        scrollTop = document.body.scrollTop;
    }
    return scrollTop;
}
  • 0
    点赞
  • 0
    评论
  • 2
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

©️2021 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值