4

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

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

有没有办法让图像保持在滚动中心？

（堆栈让我在这篇文章中附上代码，虽然在这种情况下它无关紧要，小提琴上的例子非常简单，所以我发布了一些绕过的东西）

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

<> 我正在阅读有关背景位置的其他堆栈帖子，但是当我尝试进行更新时，它表明它似乎已经破坏了视差。

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

4

2 回答 2

15

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

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

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

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

于 2013-04-11T01:33:00.867 回答
0

删除以下css

边距底部：50px；

添加以下脚本并尝试

$(window).stellar({
    scrollProperty: 'transform'
});
于 2013-04-10T17:19:43.483 回答