رویداد animationend

رویدادهای DOM رویداد AnimationEvent

تعریف و استفاده

رویداد animationend رخ می‌دهد وقتی که CSS آهنگریز کامل شد.

برای اطلاعات بیشتری در مورد CSS آهنگریز، لطفاً دوره‌های ما را مطالعه کنید: تدریس CSS3 آهنگریز.

سه رویداد ممکن است وقتی که CSS آهنگریز پخش می‌شود رخ دهند:

  • animationstart - وقتی که CSS آهنگریز شروع می‌شود رخ می‌دهد
  • animationiteration - وقتی که CSS آهنگریز تکرار می‌شود رخ می‌دهد
  • animationend - وقتی که CSS آهنگریز کامل شد رخ می‌دهد

مثال

وقتی که CSS آهنگریز انجام شد، کاری برای عنصر <div> انجام دهید:

var x = document.getElementById("myDIV");
// کد برای Chrome،Safari و Opera
x.addEventListener("webkitAnimationEnd", myEndFunction);
// زبان استاندارد
x.addEventListener("animationend", myEndFunction);

آزمایش کنید

زبان

object.addEventListener("webkitAnimationEnd", myScript);  // کد برای Chrome،Safari و Opera
object.addEventListener("animationend", myScript);        // زبان استاندارد

توضیحات:Internet Explorer 8 و نسخه‌های قبلی آن از آن پشتیبانی نمی‌کند مетод addEventListener().

جزئیات فنی

بالابردگی: پشتیبانی می‌شود
قابل لغو: پشتیبانی نمی‌شود
نوع رویداد: رویداد AnimationEvent
نسخه DOM: رویدادهای سطح 3

پشتیبانی مرورگر

اعداد در جدول نشان‌دهنده نسخه اولیه‌ای از مرورگرها هستند که به طور کامل از این رویداد پشتیبانی می‌کنند.

عدد بعد از "webkit" یا "moz" نشان‌دهنده نسخه اولیه‌ای است که باید پیشوند را استفاده کند.

رویداد Chrome IE Firefox Safari Opera
animationend 4.0 webkit 10.0 16.0
5.0 moz		 4.0 webkit 15.0 webkit
12.1

توضیحات:برای Chrome،Safari و Opera از webkitAnimationEnd استفاده کنید.

صفحات مرتبط

تدریس CSS:آنیمایشن CSS3

دستورالعمل CSS:ویژگی animation CSS3

دستورالعمل HTML DOM:ویژگی animation Style

رویدادهای DOM رویداد AnimationEvent