如何解决AOS 动画在我放大/缩小之前不会触发
如标题所述,除非放大或缩小、打开控制台或调整浏览器大小,否则我的 AOS 动画不会触发。当动画未触发时,我的页面上的内容仍会显示,但我显然更喜欢动画是否正常工作。我将在下面提供我的代码片段,如果有人能发现任何错误或有此问题的先前经验,请告诉我如何添加修复程序。提前准备。
<div
className="flex flex-col md:flex-row justify-center items-center mt-20"
data-aos="fade-in"
data-aos-duration="1200"
>
<div className="text-center md:text-left pb-4 px-8">
<h2 className="text-2xl text-gray-600">Lorem ipsum</h2>
<h2 className="text-base text-gray-700">
Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum.
</h2>
</div>
<img
src={profiles}
class="w-4/5 md:w-1/2 lg:w-1/3 mx-8 shadow-md hover:shadow-lg trans-3"
/>
</div>
解决方法
没关系,找到了解决方案。对于将来遇到类似问题的任何人,我补充说:
<script>
window.addEventListener("load",Aos.refresh);
</script>
到我的 HTML 文件的顶部,这似乎解决了问题。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。