Question

我正在使用THIS codepen使用的确切代码，并且当我们的视口中的图像仍然没有淡入时。

我没有在控制台中出现任何错误，所以我不知道为什么它会在codepen中完美运行，但在我尝试这样做的时候却不行。

HTML

<body>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>
<div class="wrap-games">
    <div class="game"></div>
    <div class="game"></div>
</div>

<script src="https://cdn.jsdelivr.net/scrollreveal.js/3.0.9/scrollreveal.min.js"></script>

</body>

JS

$(document).ready(function() {
window.sr = ScrollReveal();
sr.reveal('.game');
});

还有一些基本的CSS ..

Answer 1

在CodePen中，单击右下方的“导出”按钮以下载此非工作的非CodePen版本。您需要在头标记中包含CSS，而这些标记未包含在您的问题中。

此外，您不需要JQuery $(document).ready()，但如果您坚持使用它，您还需要在您的HTML中包含JQuery作为脚本。

scrollReveal.js无效

1 个答案: