问题标签 [animate-on-scroll]

我正在使用fullpagejs和AOS让一些 div 在滚动时从页面底部弹出（或者至少这是我想要实现的）。

不幸的是，它不起作用。

是的，我已阅读fullpage的常见问题解答scrollbar部分，是的，设置为true并autoscroll设置为false.

我的设置如下：

afterLoad 事件函数只是初始化我的菜单链接（基于幻灯片索引），唯一相关的部分是我AOS在单击一个特定链接时进行初始化（因为我希望该库仅在特定页面上工作，而不是在任何地方工作。

所以，我加载页面，点击导航到我想要的slider页面，调用函数（控制台日志证明，以及AOS类应用到相关div），我可以看到滚动条，但是什么也没有， div 没有从底部弹出。

知道我在这里做错了什么吗？

曾经有这支笔说明了同样的问题。点击“关于”（初始化AOS的函数也被称为标题的函数），滚动到底部，你会看到很多空白。如果您检查控制台，则会在元素上初始化 AOS（应用其类），但元素永远不会向上滑动）

我正在尝试在我的 wordpress 网站中实现 Michalsnik 的 Animate On Scroll 插件。但是，当我按照指示使用“data-aos”制作以下 div 时，元素变为空白而不是淡入。

这就是我尝试安装的方式：

1）我添加了

和

到我的头文件以加载 CSS 和 Javascript。

2) 我添加了
AOS.init({disable: 'mobile'}); 功能到我的脚本以激活它（但在移动设备上禁用它）

这是带有锚点的网页链接。第一篇文章是空白的，尽管它应该在滚动时淡入。

http://latelierdegaia.ch/#content

我错过了安装中的步骤吗？我做错了什么吗？

太感谢了！

我正在使用 AOS 在滚动时显示 html 元素。它单独运行良好，但是当我在包含 Slick 滑块的页面上使用它时，应用 AOS 的元素没有显示。元素是隐藏的，如果有很多滚动，看起来浏览器向 AOS 提供了有关当前滚动位置的错误信息，并且稍后显示了一些元素。

没有特定的代码会导致此问题，在与 AOS 相同的页面上使用 slick 会使 AOS 无法正常工作。

有没有人解决这个问题，我在其他网站上看到了一些悬而未决的问题，但没有找到任何解决方案？

我在 vue 中使用 AOS（滚动动画）库。AOS 提供自定义 JS 事件：document.addEventListener('aos:in', ({ detail }) => { console.log('animated in', detail); });

我想在此事件发生时触发一个函数。如何将它应用到我的 vue 组件中？它看起来像：v-on-aos:inusing v-on / @，但它不起作用。

这是我尝试过的： <div v-on:aos:in="myFunction" />

当我向下滚动到它们时，我真的希望某些东西在屏幕上动画化，就像他们在这里所做的那样......

https://michalsnik.github.io/aos/

问题是我的网站实际上嵌套在一个名为“main-content”的 div 中，侧边栏和顶部栏有单独的 div。

从这个问题和答案中可以看出，它不可能在嵌套滚动器中实现我想要的，但这是 3 年前的事了，我只是想知道是否有使用 aos 或 wow.js 或类似东西的潜在解决方法。

我尝试了几次但没有运气，但我觉得必须有办法实现这一目标。

提前致谢！

我有几个元素在使用最新的 Animate On Scroll 库 ( https://github.com/michalsnik/aos )查看（进入视口）时触发自定义事件。

https://codepen.io/anon/pen/vMGQEb

HTML：

JS：

CSS：

foo这个简单的脚本应该在元素进入视口时将元素涂成红色。除了 Edge 和 IE，它在任何地方都可以正常工作。据我所知，e.detail它不会返回 DOM 元素，但我不知道如何处理某些对象。

有任何想法吗？

我正在使用 AOS 插件，它通过自定义事件传递一个对象。该对象如下所示：

上面的对象作为e.detail. 问题是当我运行e.detail instanceof Element它时，它会true在除 IE 和 Edge 之外的所有浏览器中返回。在 IE 和 Edge 中它返回false，所以我不能将它作为一个普通的 DOM 元素使用。任何想法为什么？有没有办法解析它或什么？

我使用 AOS.js 在 NUXT 中滚动动画。AOS 在移动设备上启动了动画，但是 v-中的一些块以 0 不透明度加载并进行了转换。此块具有自定义 css 悬停和过渡。

我尝试对aos使用包装器并只为他设置动画，但它不起作用。不知道为什么，但只有这个块在移动设备上获取 data-aos="fade-down"

我的 scss 样式

我不想在移动设备上不透明和变换

我试图让滚动动画在 angular7 前端中工作，但它在路由器插座中不起作用。我认为这与 angular 如何处理路由器插座中的滚动位置有关，正如许多有关滚动的相关问题所建议的那样。

我的问题：如何在路由器插座中实现预期的行为？这甚至可能吗？有人解释为什么会出现问题吗？

具体来说，一旦通过滚动到达某些 div，我想在某些 div 上应用来自 animations.css 的 zoomIn 动画。为了让它工作，我使用了“ng2-animate-on-scroll”包，它运行良好，直到 div 位于路由器插座内。

在我的 app.component.html 中：

当我在路由器插座上方的 app.component.html 中放置一些 div 时，滚动上的动画是可见的，并且按预期工作。但是，路由器插座或以下的所有内容都没有动画。

有什么建议么？

我正在尝试使用 AOS（滚动动画）为许多页面制作 H1 元素的动画。我有几个使用标题的页面，所以我使用 jQuery 选择所有标题。如果我在每个标题中手动输入属性，它会起作用，但在通过 jQuery 添加它们时不会。我用 jQuery 选择了其他元素来为它们设置动画，它们确实有效。该图块位于每页的最顶部。谢谢！