Làm cách nào để bạn phát hiện khi hoạt ảnh CSS bắt đầu và kết thúc bằng JavaScript?

Question

Tôi đã quen với việc làm động các phần tử với JavaScript. Tôi thấy nó đơn giản hơn để làm điều đó với CSS3.

Sử dụng JavaScript làm cách nào bạn có thể phát hiện khi hoạt ảnh CSS đã bắt đầu và khi nào kết thúc? Có cách nào cả?

Answer 1

Liên kết các sự kiện thích hợp với phần tử, ví dụ:

el.addEventListener("animationstart", function() {}, false); 
el.addEventListener("animationend", function() {}, false); 
el.addEventListener("animationiteration", function() {}, false); 

https://developer.mozilla.org/en-US/docs/CSS/Tutorials/Using_CSS_animations#Using_animation_events

Lưu ý: Bạn có thể cần phải thêm tiền tố thích hợp-sự kiện là tốt, ví dụ webkitAnimationEnd