مثال
تغيير الرسوم المتحركة ل <div> عنصر، وذلك باستخدام الخاصية المختصرة:
// Code for Chrome, Safari and Opera
document.getElementById("myDIV").style.WebkitAnimation = "mynewmove 4s 2";
// Standard syntax
document.getElementById("myDIV").style.animation =
"mynewmove 4s 2"; انها محاولة لنفسك » تعريف والاستخدام
الخاصية الرسوم المتحركة هي الخاصية المختصرة لمدة ستة من خصائص الرسوم المتحركة:
animationName
animationDuration
animationTimingFunction
animationDelay
animationIterationCount
animationDirection
Note: دوما تحديد الملكية animationDuration، وإلا فإن المدة هي 0، ولن يكون لعبت.
دعم المتصفح
الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.
أرقام تليها بكت، غادة عادل، أو O تحدد النسخة الأولى التي عملت مع بادئة.
| خاصية | |||||
|---|---|---|---|---|---|
| animation | 43.0 4.0 بكت | 10.0 | 16.0 5.0 غادة عادل | 4.0 بكت | 30.0 15.0 بكت 12.1 12.0 -o- |
ملاحظة: كروم وسفاري وأوبرا دعم بديل، الخاصية WebkitAnimation.
بناء الجملة
إعادة الممتلكات الرسوم المتحركة:
object .style.animation تعيين الخاصية الرسوم المتحركة:
object .style.animation=" قيم الممتلكات القيمة وصف animationName تحدد اسم الإطار الرئيسي الذي تريد ربط محدد animationDuration يحدد عدد الثواني أو مللي ثانية يأخذ الرسوم المتحركة لاستكمال
animationTimingFunction تحديد منحنى سرعة الحركة animationDelay يحدد مهلة قبل سيبدأ الرسوم المتحركة
animationIterationCount يحدد عدد المرات التي يجب أن تقوم على الرسوم المتحركة animationDirection تحدد ما إذا كان يجب أن تلعبه الرسوم المتحركة في الاتجاه المعاكس على دورات بديلة animationFillMode يحدد ما القيم التي تطبقها الرسوم المتحركة خارج الوقت الذي تنفذ animationPlayState تحديد ما إذا كان يتم تشغيل الرسوم المتحركة أو مؤقتا initial تحدد هذه الخاصية إلى قيمته الافتراضية. قرأت عن الأولي inherit يرث هذه الخاصية من عنصر الأم. قراءة حول وراثة
تفاصيل تقنية
القيمة الافتراضية: لا شيء 0 سهولة 0 1 العادي لا شيء التوالي قيمة الإرجاع: A سلسلة، تمثل الممتلكات الرسوم المتحركة عنصر صفحة CSS CSS3
صفحات ذات صلة
CSS المرجع animation property
<كائن نمط