javascript - splinter 的视差卷轴

Question

最近，我注意到我的视差代码从左到右出现奇怪的抖动。代码非常简单:

$(window).scroll(function(){
    var body = $('body');
    var top = $(this).scrollTop();
    $('.carousel-inner img').css('top', top / 2);
}); 

在这个演示中可以看到同样的抖动问题 http://www.bootply.com/vTCajmeQHQ

为什么会这样？浏览器渲染滚动事件的方式是否改变了？我怎样才能修复它，让它不再抖动？几个月前才开始出现这种情况，之前很顺利。

我的标记看起来像这样 <%= image_tag 'img.jpg'%> <%= image_tag 'img1.jpg'%>

Answer 1

确切的问题是 BG 图像的初始定位，尤其是如果您遵循您提供的示例中的代码。

因此，就目前而言，初始位置是:

background: url('/assets/example/bg_blueplane.jpg') no-repeat center center fixed;

但是当您应用新样式时，“center center”定位将被重置，并相对于窗口顶部重新定位。实际上，我非常确定您提供的示例中的其他图像也会发生这种情况，只是我们在开始滚动时看不到它们。

去掉初始定位，应该就能得到你要的效果了。