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

时间:2013-08-29 06:23:05

标签: jquery html css

固定元素随您滚动,然后仅在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;
}

1 个答案:

答案 0 :(得分:0)

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