TAG
CSS
JavaScript
Result
Run
License
<div id="box" class="box">Click me</div>
.box { width: 70px; height: 70px; background: #FF0000; border-radius: 50%; position: relative; color: #FFF; text-align: center; line-height: 70px; animation: myani 1000ms 5; } @keyframes myani { from { left: 0px; } to { left: 100px; } }
window.addEventListener("load", () => { let elBox = document.querySelector("#box"); elBox.onclick = e => { var el = e.currentTarget; el.style.animationName = "none"; }; elBox.addEventListener("animationcancel", e => { console.log("Canceled"); }); });
Console
expand_less
License
License
by DevDic
Close