oBtn.onclick = function() { oSunlight.style.display = "flex"; oSunlight.style.animation = "shot 3s"; oSunlight.style.animationFillMode ="forwards"; }针对以上代码,给我的动画写一个重置动画的按钮
时间: 2024-03-14 11:45:55 浏览: 94
javascript大事托付的用法及其好处简析_.docx
好的,以下是针对以上代码添加重置动画按钮的示例代码:
HTML部分:
```html
<button id="resetBtn">重置动画</button>
```
JavaScript部分:
```javascript
const oBtn = document.querySelector('#resetBtn');
const oSunlight = document.querySelector('#sunlight');
// 点击重置按钮后,重置动画
oBtn.onclick = function() {
oSunlight.style.animation = 'none'; // 先将animation设为none
oSunlight.offsetHeight; // 触发重绘
oSunlight.style.animation = null; // 再将animation设为null
};
```
通过将animation设为none,然后再触发重绘,最后将animation设为null,可以达到重置动画的效果。
阅读全文