在WebKit中转换期间滚动时固定元素会中断

Question

固定元素与您一起滚动，然后仅在Webkit中重新出现在正确的位置。 在Firefox上很好用。

JS：

var num = 50; //number of pixels before modifying styles 

$(window).bind('scroll', function() { 
    if ($(window).scrollTop() > num) { 
     $('.menu').addClass('fixed'); 
    } else { 
     $('.menu').removeClass('fixed'); 
    } 
}); 

HTML：

<div class="menu"><h1> Amigas </h1></div> 

CSS：

.menu { 
background: #345; 
color: #FFF; 
z-index: 999; 
padding: .5em; 
position: absolute; 
top: 47px; 
left: 0; 
width: 100%; 
} 
.fixed { 
    position:fixed; 
    top:0; 
} 

Answer 1

这是浏览器的特定功能。 Firefox默认使用新版本开始平滑滚动。在Chrome中，您需要自行启用它，或者您可以使用插件。要启用它，您可以打开chrome：// flags/page并启用“平滑滚动”选项。或者您可以使用“Chromium Wheel Smooth Scroller”插件等更多选项。