Cli*_*udu 2 html javascript css css-animations
到目前为止,这是我的脚本:
HTML:
<head>
<link rel="stylesheet" type="text/css" href="mystyles.css">
</head>
<body>
<div id="test"></div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
CSS:
#test {
background-color: blue;
width: 100px;
height: 100px;
}
/* Here is the animation (keyframes) */
@keyframes fading {
0% { opacity: 1; }
100% { opacity: 0; }
}
Run Code Online (Sandbox Code Playgroud)
但是,如何使用某些JavaScript在CSS #div上播放CSS动画(关键帧)?
小智 5
尝试从js添加“动画” css属性:
document.getElementById('test').style.animation = 'fading 2s infinite'
Run Code Online (Sandbox Code Playgroud)