<分区>
<分区>
我有一个空 div 的闪烁 Sprite css 动画。
#flashIt{
width: 50%;
height: 100px;
background: blue;
margin: 10px auto;
border: solid 2px black;
left: 25%;
animation: flash 1s linear infinite;
}
@keyframes flash {
0% { opacity: 1; }
50% { opacity: .1 }
100% { opacity: 1; }
}
所以这个动画按原样工作。但是我希望动画在用户按下键盘上的键时开始。我如何使用 JS 执行此操作?对此的帮助将不胜感激。谢谢
最佳答案
执行此操作的一种简单方法是监听按键,然后在按下某个键时将类应用到适当的 DOM 元素。此类将包含您的动画样式,然后按照您的需要为元素设置动画。
var elementToAnimate = document.findElementById("flashIt");
document.addEventListener('keypress', function(event) {
elementToAnimate.classList.add('your-animation-class');
});
关于javascript - 如何使用 Javascript 键盘事件触发 CSS Sprite 动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49353761/