更改滚动上的图像和文本（Javascript）

【问题标题】：Change image and Text on Scroll (Javascript)更改滚动上的图像和文本（Javascript）
【发布时间】：2020-04-17 02:00:33
【问题描述】：

我在 javascript 方面没有太多经验，但我试图实现像 https://district2.studio/ 这样的幻灯片，其中文本和图像会随着滚动而变化。在示例中，无论您一次滚动多少或在图像更改动画之间滚动，图像一次只会更改一次。我正在尝试仅使用 javascript 来实现这一点，而没有其他插件或库。希望有人可以帮助我。

【问题讨论】：

这能回答你的问题吗？ Active CSS animation only when you scroll on the view of the specific div

标签： javascript html css

【解决方案1】：

你有一些错误。

首先，您必须等待 DOM 准备就绪。您可以在 de body 标签关闭之前将其全部移动以确保或使用 window.onload

类道具元素它是一个数组。

window.onload = function() {
    document.getElementById("image1").onscroll = function() {
        if(document.getElementById("image2").classList.contains("scroll")){
            document.getElementById("image2").classList.remove("scroll");
        } else {
            document.getElementById("image2").classList.add("scroll");
        }
    };
}

这样的东西应该可以工作

【讨论】：