javascript - IE7-8 中的生涩视差

Question

我在我正在开发的网站中引入了基本的视差效果。在Chrome、Firefox、IE9中流畅运行；但它在 IE7 和 IE8 中确实很不稳定。我看过更复杂的网站，但我没有看到任何像我得到的“急躁”的东西。我只使用了两张顶部带有扫描线纹理的图像。

知道是什么原因造成的吗？

#intro {
    background: url(../img/graphics/top-bg.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-width: 1024px;
    min-height: 768px;
    height: 100%;
    position: relative;
}

#second {
    background: url(../img/graphics/content-bg-2.jpg) center no-repeat fixed;
    position: relative;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-width: 1200px;
    min-height: 768px;
    height: 4800px;
}

感谢任何帮助，谢谢。

Answer 1

请检查此设置(在评论中)How can I check browser smooth scrolling support via Javascript? .

如果它被禁用 - 这是正常的。

据我了解http://www.ianlunn.co.uk/demos/recreate-nikebetterworld-parallax/是示例，而不是您的代码。如果禁用平滑滚动 - 它会产生“不稳定”效果(我禁用了平滑滚动的是 Chrome、Opera 和 IE8)。

滚动原理的原因。如果此设置被禁用 - 它的工作方式类似于永久 +100px。如果启用 - 它的工作方式类似于每 50 毫秒 10 次，每次 +10 像素。

---

更新

为了获得更好的性能，你可以这样做:

• 无需插件即可编写自己的代码

• 基于当前 scrollTop 间隔而不是每次滚动调用构建事件调用

• 在开头缓存jquery节点

• 主要原则 - 更少的节点操作 = 更高的性能

我在 jquery 上写了类似的效果 - 你可以在这里看到 http://www.thecommoditycode.com/ambersoftware/及使用原则