Javascript 视差背景性能和行为

到目前为止，我已经创建了一个水平滚动的站点，该站点在元素背景图像上具有视差效果（这些图像被拉伸以适合视口的大小）。我用图书馆来达到这个效果

$.stellar({
    horizontalScrolling: true,
    verticalScrolling: false,
    horizontalOffset: $(window).width()
});

然而，我面临两个问题

在元素完全消失之前，图像往往会“耗尽”；下面显示白色背景。这种影响的严重程度取决于视口的大小和形状，因此我猜想，试图找出图像大小、纵横比或定义的滚动比所涉及的数学是不值得的。有没有办法使恒星内部的滚动比率“自动”，这样背景就永远不会“耗尽”（或者有另一种视差库可以做到这一点）

无论浏览器和机器是什么，效果的表现都很糟糕。删除背景尺寸：封面看起来有点改善，但还不够；使用

img

元素是否会提高背景图像的性能？这是一个巨大的变化，也是一种混乱的方式，但如果它能修复滞后的滚动，那将是值得的

---

提前谢谢

按照@Shivam的建议，使用skrollr.js代替。我也有同样的问题。见：

Skrollr.js将开始偏移设置为0，这样即使将背景设置为封面，也不会得到图像下方的空间

---

以下是我在我的网站上使用的教程：。说明中唯一缺少的是，在步骤1中，您还需要包含示例文件附带的imagesloaded.js文件。希望有帮助！我花了好几天的时间试图找到解决办法

只是一个建议，试试看。更强大、更平滑、更灵活的视差效果；Skrollr中是否有方法确保背景图像始终覆盖其元素，并据此调整滚动比率？