我正在尝试使用 Aos 进行动画处理,但由于某种原因,只有初始值被采用,然后动画不会持续到最后

问题描述

这是我的 HTML

<section className="about-me">
   <h1 >About me</h1>
   <p data-aos="example" className="introduction">Hello,my name is</p>

这是我的动画 CSS

[data-aos="example"] {
opacity: 1;
transition-property: transform,opacity;

&.aos-animate {
    opacity: 0;
}

@media screen and (min-width: 768px) {
    transform: translateX(100px);

    &.aos-animate {
        transform: translateX(0);
    }
}

}

该元素的不透明度为 0,并且永远不会变为 1。我无法弄清楚为什么会发生这种情况。 感谢您的帮助

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)