مثل animationiteration الحدث

تعريف والاستخدام

يحدث حدث animationiteration عند تكرار تأثير CSS.

إذا مثل CSS animation-iteration-count الخاصيةإذا تم تعيينه على "1"، فإنه يعني أن التحريك سيشغل مرة واحدة فقط و لن يحدث حدث animationiteration. يجب تشغيل التحريك عدة مرات لتنشيط هذا الحدث.

للحصول على معلومات أكثر حول تأثير CSS، يرجى متابعة تدريس تأثير CSS3.

عندما تُعرض CSS من الحركة، قد تحدث ثلاثة أحداث:

مثال

عندما تنتهي CSS من الحركة، قم بفعل شيء مع عنصر <div>:

var x = document.getElementById("myDIV");
// للـ Chrome و Safari و Opera
x.addEventListener("webkitAnimationIteration", myRepeatFunction);
// بناء جملة معيارية
x.addEventListener("animationiteration", myRepeatFunction);

تجربة شخصية

اللغة

الجسم.addEventListener("webkitAnimationIteration", myScript);  // للـ Chrome و Safari و Opera
الجسم.addEventListener("animationiteration", myScript);        // بناء جملة معيارية

التعليقات:Internet Explorer 8 أو الأقدم لا يدعم طريقة addEventListener().

تفاصيل تقنية

تدفق الارتفاع: مدعوم
قابل للإلغاء: غير مدعوم
نوع الحدث: مثل AnimationEvent
إصدار DOM: حوادث المستوى 3

دعم المتصفح

الرقم في الجدول يشير إلى إصدار المتصفح الذي يدعم الحدث بشكل كامل.

الرقم الذي يليه "webkit" أو "moz" يشير إلى الإصدار الأول الذي يتم استخدامه مع المقدمة.

حدث Chrome IE Firefox Safari Opera
animationiteration 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

دليل CSS:خصائص animation-iteration-count في CSS3

دليل HTML DOM:مثل Style animation الخاصية