CSS3 animation Property

ملزمة للرسوم المتحركة ل <div> عنصر، وذلك باستخدام الخاصية المختصرة:

div {
-webkit-animation: mymove 5s infinite; /* Chrome, Safari, Opera */
animation: mymove 5s infinite;
}

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

الخاصية الرسوم المتحركة هي الخاصية المختصرة لمدة ثمانية من خصائص الرسوم المتحركة:

Note: دوما تحديد الملكية للرسوم المتحركة المدة، وإلا فإن المدة هي 0، ولن يكون لعبت.

القيمة الافتراضية:	none 0 ease 0 1 normal none running
وارث:	no
Animatable:	no. Read about animatable
الإصدار:	CSS3
جافا سكريبت بناء الجملة:	object .style.animation="mymove 5s infinite" Try it

الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.

أرقام تليها -webkit-، -moz-، أو -o- تحدد النسخة الأولى التي عملت مع بادئة.

خاصية
animation	43.0 4.0 -webkit-	10.0	16.0 5.0 -moz-	تسعة 4.0 -webkit-	30.0 15.0 -webkit- 12.0 -o-

animation:name duration timing-function delay iteration-count direction fill-mode play-state;

القيمة	وصف
animation-name	تحدد اسم الإطار الرئيسي الذي تريد ربط محدد
animation-duration	يحدد عدد الثواني أو مللي ثانية يأخذ الرسوم المتحركة لاستكمال
animation-timing-function	يحدد منحنى سرعة الحركة
animation-delay	يحدد مهلة قبل سيبدأ الرسوم المتحركة
animation-iteration-count	يحدد عدد المرات التي يجب أن تقوم على الرسوم المتحركة
animation-direction	تحدد ما إذا كان يجب أن تلعبه الرسوم المتحركة في الاتجاه المعاكس على دورات بديلة
animation-fill-mode	يحدد ما القيم التي تطبقها الرسوم المتحركة خارج الوقت الذي تنفذ
animation-play-state	يحدد ما إذا كانت الرسوم المتحركة يتم تشغيل أو توقف
initial	تحدد هذه الخاصية إلى قيمته الافتراضية. قرأت عن الأولي
inherit	يرث هذه الخاصية من عنصر الأم. قراءة حول وراثة

CSS3 البرنامج التعليمي: CSS3 متحركة

HTML DOM المرجع animation property