开发者社区> 问答> 正文

导航栏滚动锁定的时候会有短暂的闪烁,不知道如何解决

现在在做的站点上面的导航栏需要随鼠标上下滚动的时候始终锁定在顶部,然后昨天实现的也很简单

.fixed {
    background: #FFFFFF;
    position: fixed;
    top: 0px;
    width: 100%;
    height: 78px;
    z-index: 1999;
}
jQuery(document).ready(function() {
    $(window).scroll(function() {
    var f1 = $(window).scrollTop();
    var f2 = $("#nav").offset().top;
    console.log("f1: %d, f2: %d", f1, f2);

    if(f1 > 0){
        $("#nav").addClass("fixed", 1000);
    }else{
        $("#nav").removeClass("fixed", 1000);
    }
});

然后的确可以有导航锁定的效果,可是唯一很蛋疼的是当开始addClass和removeClass也就是开始让导航栏锁定和接触导航栏锁定的两个时候会有明显的闪烁,可能是导航栏重新刷新了加载了图片之类,但是这样体验就很差了,调了半个晚上还是没什么实质上的解决,求问各位js,css大神有没有好的解决方法。

展开
收起
a123456678 2016-03-25 14:20:28 2133 0
1 条回答
写回答
取消 提交回答
  • 。这样写代码当然会闪烁啊(一开始不显示导航条,下拉的时候才会显示),导航条不突然出来吓人一跳才奇怪的好吧==!我觉得你是不是想要一个过渡的效果呢?过渡效果有很多种啊,比如渐入渐出、伸缩、移位之类,看你要什么样的效果了

    2019-07-17 19:14:17
    赞同 展开评论 打赏
问答分类:
问答地址:
相关产品:
问答排行榜
最热
最新

相关电子书

更多
低代码开发师(初级)实战教程 立即下载
冬季实战营第三期:MySQL数据库进阶实战 立即下载
阿里巴巴DevOps 最佳实践手册 立即下载