gpt4 book ai didi

javascript - 如何触发CSS动画

转载 作者:行者123 更新时间:2023-11-29 18:50:03 25 4
gpt4 key购买 nike

<分区>

我是 CSS 的新手,但了解基础知识,我想使用按钮触发此动画。我无法让它工作。

我在 Stackoverflow、Jquery、Jscript 中使用了几个示例,但似乎没有一个涉及 @keyframes。

我看到更多关于通过类引用动画和删除类的信息(据我了解,这种方式通过删除元素来重新启动动画)。我尝试将其切换到类(class)。

我也想知道什么是最佳实践?

什么是最好的方法?我以为这很简单,但我错了.....

我有这样的 CSS:

#test {
margin-left: 20px;
margin-top: 20px;
width: 50px;
height: 0px;
background: maroon;
position: absolute;
animation-name: example;
animation-duration: 3s;
animation-fill-mode: forwards;
animation-delay: 0s;

}
@keyframes example {
from { transform: translateY(200px)}
to {height: 200px; background-color: teal;}
}

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com