خصوصية Style animation
- الصفحة السابقة alignSelf
- الصفحة التالية animationDelay
- العودة إلى الطبقة السابقة مفهوم Style في HTML DOM
التعريف والاستخدام
animation
الخصوصية هي الخاصية القصيرة لأحد عشر خصائص الرسوم المتحركة:
- animationName
- animationDuration
- animationTimingFunction
- animationDelay
- يحدد تأخير بدء التحريك.
- يحدد عدد مرات عرض التحريك.
ملاحظة:يرجى دائمًا تحديد خصوصية animationDuration، وإلا سيكون زمن الاستمرار 0 ولن يتم عرضه أبدًا.
مثال
استخدام الخاصية القصيرة لتغيير الرسوم المتحركة لـ <div> العنصر:
document.getElementById("myDIV").style.animation = "mynewmove 4s 2";
النحو
استرداد خاصية animation:
object.style.animation
تعيين خاصية animation:
object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"
قيمة الخاصية
القيمة | الوصف |
---|---|
animationName | يحدد اسم الكائن المراد ربطه بالكائن المحدد. |
animationDuration | يحدد الوقت الذي يستغرقه التحريك للانتهاء. |
animationTimingFunction | يحدد مسار سرعة التحريك. |
animationDelay | animationDelay |
يحدد تأخير بدء التحريك. | animationIterationCount |
يحدد عدد مرات عرض التحريك. | animationDirection |
يحدد ما إذا كانت التحريكات يجب أن تُعرض بشكل عكسي في دورة التبديل. | animationFillMode |
يحدد القيمة التي تطبق على التحريكات خارج وقت التنفيذ. | animationPlayState |
ضع هذه الخاصية في قيمتها الافتراضية. يرجى الرجوع إلى | يحدد هذا العنصر ما إذا كانت التحريكات تعمل أو تتوقف. ضع هذه الخاصية في قيمتها الافتراضية. يرجى الرجوع إلى. |
تنقل هذه الخاصية من عنصر الأب لتنفيذ هذه الخاصية. يرجى الرجوع إلى | initial تنقل هذه الخاصية من عنصر الأب لتنفيذ هذه الخاصية. يرجى الرجوع إلى. |
inherit
تفاصيل التقنية | القيمة الافتراضية: |
---|---|
القيمة المعدلة: none 0 ease 0 1 normal none running | القيمة، تعبر عن خصائص animation. |
إصدار CSS: | CSS3 |
دعم المتصفحات
animation
هي خاصية CSS3 (1999).
يدعم جميع المتصفحات بشكل كامل:
Chrome | Edge | Firefox | Safari | Opera | IE |
---|---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera | IE |
دعم | دعم | دعم | دعم | دعم | 11 |
الصفحات ذات الصلة
دليل CSS:خصائص animation
- الصفحة السابقة alignSelf
- الصفحة التالية animationDelay
- العودة إلى الطبقة السابقة مفهوم Style في HTML DOM