Question

在移动版本中，firefox的一切都很完美。在Chrome中有固定定位的bug。当我滚动标题时必须将绝对值更改为固定值，高度为65到35像素。但是它的闪烁。我是web开发的新手。它是我的第一个静态web site。我正在使用jquery插件skrollr。

继承我的jquery代码



$(window).scroll(function(){
      if ($(this).scrollTop() > 20) {
        $('.menu ').addClass("sticky");
      } 
      else {
        $('.menu').removeClass("sticky");
      }
    });

$(window).scroll(function(){ if ($(this).scrollTop() > 20) { $('.menu ').addClass("sticky"); } else { $('.menu').removeClass("sticky"); } }); 和我的CSS代码

.menu {
    position absolute;
    background: white;
    height: 65px;
}
.menu.sticky {
    position:fixed;
    height: 37px;
    max-width: 480px;
    padding: 0;
    background: white;
}

请帮助周已解决这个问题。

Answer 1

在 .menu 课程中使用过渡：全部0.4s轻松进入。您可以根据需要调整转换延迟。还有一个你不需要为此添加任何插件。您可以使用小型jquery代码和CSS3动画轻松处理此问题。

如何修复移动chrome中关于位置固定的bug。以及firefox和chrome之间的区别

1 个答案: