ScrollReveal'没有找到元素'？答案

【问题标题】：ScrollReveal 'no elements found'?ScrollReveal'没有找到元素'？
【发布时间】：2018-08-04 06:54:13
【问题描述】：

我一直在搞乱一些 JavaScript 库，这些库可能会帮助我创建一个我期待创建的投资组合网站。但是，我遇到了 scrollreveal.js 库的问题。当我加载站点（本地测试）时，我在控制台ScrollReveal: reveal on ".example" failed, no elements found.

这是我的代码

HTML：

<div id="mainContent1">

<div class="example" data-scroll></div>

</div>

CSS：

.example {
    height: 150px;
    width: 150px;
    background-color: #000000;
    display: block;
    margin-top: 150vh; //just to be able to scroll down for sr effect
}

Javascript：

window.sr = ScrollReveal ();
sr.reveal('.example');

我根本无法让它工作，希望能提供任何帮助。谢谢！

【问题讨论】：

我从未使用过它，但听起来'example' div 中需要有一些内容。 ?
@wazz 我也这么认为，但是控制台让它听起来好像 id 为“example”的 div 不存在。我之前确实在 div 中有内容，但仍然收到相同的控制台消息。
我只是在小提琴中试了一下，它似乎可以工作。您必须向下滚动到最底部。（确保 css 中的评论消失或正确评论。/* comment */）。 jsfiddle.net/wazz/9f8o5m7g/8
@wazz 可能是浏览器问题，正如您所指出的，它可以在小提琴上运行，但在 Chrome 上本地测试时却不行。不过，我已经尝试过多种浏览器，但我无法让它在其中任何一种上运行（Chrome、IE (ew)、Safari、FireFox、Opera 等）
ScrollReveal 的链接在哪里？确保它就在结束

标签： javascript html css scrollreveal.js

【解决方案1】：

确保指向 ScrollReveal 库的链接就在结束标记之前。并确保你的脚本在那之后。

如果您的脚本位于顶部，它将寻找页面上尚未出现的元素。

【讨论】：