以 Stellar JS 为中心的 CSS 背景图片

Question

我正在使用 Stellar JS 为元素设置背景图像，并尝试实现以视差移动的居中图像。但是，当我尝试使用标准方法时，我意识到背景位置由 stellar 更新，然后覆盖居中(我假设这就是覆盖它的原因)。我创建了一个 fiddle 来解释这种情况。

http://jsfiddle.net/captDaylight/wvuQm/1/

有没有办法让图片在滚动条上保持居中？

(堆栈让我在这篇文章中附上代码，尽管在这种情况下它无关紧要， fiddle 上的示例非常简单，所以我发布了一些可以绕过的东西)

background: url(http://upload.wikimedia.org/wikipedia/commons/e/e5/Seine_wide.jpg) no-repeat center center; 
background-size: auto 100%;

<>我正在阅读其他 stack post关于背景位置，但是当我尝试进行更新时，它表明它似乎已经打破了视差。

http://jsfiddle.net/captDaylight/wvuQm/3/

Answer 1

您需要禁用水平视差。这将导致 Stellar.js 保持水平背景定位不变。

在您的示例中，对 Stellar 的更新调用

$(window).stellar({ horizontalScrolling: false });

我已经通过以下更改更新了您的 JSFiddle 示例:http://jsfiddle.net/wvuQm/5/