js触发css3动画写法
在JavaScript中触发CSS3动画可以通过修改元素的CSS类或样式来实现。下面是一个简单的示例,展示如何使用JavaScript触发一个CSS3动画:
首先,假设我们有一个CSS样式定义了一个动画:
```css
keyframes example {
  0% {background-color: red;}
  50% {background-color: blue;}
  100% {background-color: green;}
}
.animate {
  animation-name: example;
  animation-duration: 4s;
css渐入渐出动画}
```
然后,我们可以在JavaScript中添加或删除这个类来触发动画:
```javascript
// 获取元素
var element = ('myElement');
// 添加动画类,触发动画
('animate');
// 在动画结束后移除动画类,防止重复触发
('animationend', function() {
  ('animate');
});
```
在这个例子中,我们首先获取了ID为`myElement`的元素,然后使用`()`方法添加了`animate`类,这将触发CSS中定义的动画。然后,我们添加了一个事件,当动画结束时(`animationend`事件被触发),我们将`animate`类从元素中移除,防止动画重复触发。