الفرق بين المراجعتين لصفحة: «CSS/animation-play-state»

المراجعة الحالية بتاريخ 08:31، 12 أغسطس 2018

الخاصية animation-play-state في CSS تُحدِّد إذا كانت الحركة تعمل أو متوقفة مؤقتًا، ويمكن الحصول على قيمة هذه الخاصية عبر JavaScript لمعرفة حالة الحركة، ويمكن أيضًا استعمال JavaScript لضبط قيمتها لتوقيف الحركة مؤقتًا أو استئنافها.

بطاقة الخاصية

القيمة الابتدائية	`running`
تُطبَّق على	جميع العناصر.
قابلة للوراثة	لا
قابلة للتحريك	لا
القيمة المحسوبة	كما حُدِّدَت.

/* قيمة واحدة */
animation-play-state: running;
animation-play-state: paused;

/* عدِّة قيم */
animation-play-state: paused, running, running;

/* القيم العامة */
animation-play-state: inherit;
animation-play-state: initial;
animation-play-state: unset;

استئناف الحركات المتوقفة مؤقتًا سيسمح بإكمالها من مكان توقفها، بدلًا من البدء مجددًا من بداية سلسلة الحركات.

دعم المتصفحات

الميزة	Chrome	Firefox	Internet Explorer	Opera	Safari
الدعم الأساسي	4.0 (مع السابقة `-webkit-`) 43.0	5.0 (مع السابقة `-moz-`) 16.0	10	15.0 (مع السابقة `-webkit-`) 30.0	5.1 (مع السابقة `-webkit-`) 9.0

البنية العامة

تقبل الخاصية animation-play-state قيمةً واحدةً أو أكثر.

`running`

الحركة تعمل حاليًا.

`paused`

الحركة متوقفة حاليًا توقفًا مؤقتًا.

البنية الرسمية

animation-play-state: <single-animation-play-state>#;

حيث:

<single-animation-play-state> = running | paused

انظر أيضًا

صفحة الخاصية animation والخاصيات الفرعية التي تضبطها هذه الخاصية وهي animation-name و animation-duration و animation-timing-function و animation-delay و animation-iteration-count و animation-direction و animation-fill-mode.

مصادر ومواصفات

مسودة CSS Animations.

@@ سطر 71: / سطر 71: @@
 </syntaxhighlight>
+==  انظر أيضًا ==
+* صفحة الخاصية <code>[[CSS/animation|animation]]</code> والخاصيات الفرعية التي تضبطها هذه الخاصية وهي <code>[[CSS/animation-name|animation-name]]</code> و <code>[[CSS/animation-duration|animation-duration]]</code> و <code>[[CSS/animation-timing-function|animation-timing-function]]</code> و <code>[[CSS/animation-delay|animation-delay]]</code> و <code>[[CSS/animation-iteration-count|animation-iteration-count]]</code> و <code>[[CSS/animation-direction|animation-direction]]</code> و <code>[[CSS/animation-fill-mode|animation-fill-mode]]</code>.
 == مصادر ومواصفات ==