javascript - 两个动画，都向前

Question

我有一个 id 为 center 的 Div。我在 CSS 文件中将 Div 的不透明度设置为 0。当窗口加载时，我给 Div 一个动画: document.getElementById('center').style.animation = "UP 1s forwards";如果用户单击一个按钮，我将动画更改为: document.getElementById('center').style.animation = "DOWN 1s forwards";问题:第二个动画不显示，Div突然消失。

Answer 1

示例 fiddle 或更多代码可能会有所帮助。很多事情都可能是错误的。

• 向下动画的关键帧可能以 opacity 0;
开头
• 您需要在 CSS 中设置一些位置属性才能使用上/右/下/左属性。检查一下。
• 点击时 JS 可能有问题。

只是一些我能想到的。

根据你的描述，感觉像是 toast 动画。这是一个 fiddle 。

https://jsfiddle.net/thelessergeek/rj7a06hm/

希望您正在寻找它。我的 JS 可能有点难过。按照你认为合适的方式解决。谢谢!