使用机车滚动滚动时图像或内容消失答案

【问题标题】：Images or contents disappearing when scrolling using locomotive scroll使用机车滚动滚动时图像或内容消失
【发布时间】：2021-05-10 14:06:26
【问题描述】：

所以这是我迄今为止的第一个问题。我正在从头开始构建一个静态网站。我对 html 和 css 非常了解，但我并没有那么神奇。（我仍然是设计师而不是开发人员。）

我正在使用这个机车来实现平滑的滚动和视差效果，但要么存在错误，要么与代码（我的 html 结构或某些不良样式）冲突，导致页面末尾的图像消失。我无法追踪问题，所以任何人都可以请看一下它们会很棒。谢谢！

编辑 2：所以问题是由使用 data-scroll-section 引起的，这有望提高性能/速度，但似乎可能存在错误。它会删除视图外的部分以保存可以理解的数据，尽管它可能会过早地删除这些部分。可能有些误判？

删除data-scroll-section 并仅使用data-scroll 和data-scroll-speed 后，一切正常。虽然有点慢和小故障。 :/ 希望以后会改进。

编辑 1：需要明确的是，该插件有效，只是图像在滚动结束时消失了。

链接：

【问题讨论】：

您在什么浏览器中进行测试？如果您在 Chrome 或 Edge 中并学习使用开发者工具，那么值得您花时间按下 F12 键。您应该能够在代码中设置断点并调试您的逻辑。还要确保查看控制台选项卡以记录输出 - 使用 console.log("Message or variable here"); 检测您的代码。语句 - 或直接变量 /argument/object 评估。您还可以操作 CSS 并查找 HTML 元素等。
我的是 Chrome。我确实检查了它，没有显示任何错误。我会尝试更多你的建议。谢谢。

【解决方案1】：

找到解决办法

html.has-scroll-smooth 
{
    overflow: hidden;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;  
}

将此添加到 css 中，它将解决该元素消失的问题

【讨论】：