JavascriptでCSSアニメーションを制御することはできないのでしょうか?
html
1<body> 2 <img id="image" src="gazou.png"> 3</body>
javascript
1document.getElementById("image").addEventListener("click",function(){ 2 「fade_in」CSSアニメーション起動! 3})
css
1 2#image{ 3 animation-duration:1s; 4} 5 6@keyframes fade_in{ 7 0%{ 8 transform:scale(1) rotate(0deg); 9 } 10 50%{ 11 transform:scale(2) rotate(360deg); 12 } 13 100%{ 14 transform:scale(1) rotate(0deg); 15 }
画像をクリックするたびに大きさが2倍になって、くるっと回って元の形に戻る というような感じです
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。