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

من موسوعة حسوب
< CSS
ط استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}'
لا ملخص تعديل
سطر 1: سطر 1:
<noinclude>{{DISPLAYTITLE:الخاصية <code>animation-play-state</code>}}</noinclude>
<noinclude>{{DISPLAYTITLE:الخاصية <code>animation-play-state</code>}}</noinclude>
الخاصية <code>animation-play-state</code> في CSS تُحدِّد إذا كانت الحركة تعمل أو متوقفة مؤقتًا، ويمكن الحصول على قيمة هذه الخاصية عبر JavaScript لمعرفة حالة الحركة، ويمكن أيضًا استعمال JavaScript لضبط قيمتها لتوقيف الحركة مؤقتًا أو استئنافها.<nowiki/> <syntaxhighlight lang="css">
الخاصية <code>animation-play-state</code> في CSS تُحدِّد إذا كانت الحركة تعمل أو متوقفة مؤقتًا، ويمكن الحصول على قيمة هذه الخاصية عبر JavaScript لمعرفة حالة الحركة، ويمكن أيضًا استعمال JavaScript لضبط قيمتها لتوقيف الحركة مؤقتًا أو استئنافها.
/* قيمة واحدة */
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;
</syntaxhighlight>استئناف الحركات المتوقفة مؤقتًا سيسمح بإكمالها من مكان توقفها، بدلًا من البدء مجددًا من بداية سلسلة الحركات.
{| class="wikitable" style="width: 100%;"
{| class="wikitable" style="width: 100%;"
|-
|-
سطر 30: سطر 20:
|كما حُدِّدَت.
|كما حُدِّدَت.
|}
|}
<syntaxhighlight lang="css">
/* قيمة واحدة */
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;
</syntaxhighlight>استئناف الحركات المتوقفة مؤقتًا سيسمح بإكمالها من مكان توقفها، بدلًا من البدء مجددًا من بداية سلسلة الحركات.


== دعم المتصفحات ==
== دعم المتصفحات ==
سطر 54: سطر 58:
تقبل الخاصية <code>animation-play-state</code> قيمةً واحدةً أو أكثر.
تقبل الخاصية <code>animation-play-state</code> قيمةً واحدةً أو أكثر.


=== القيمة <code>running</code> ===
=== <code>running</code> ===
الحركة تعمل حاليًا.
الحركة تعمل حاليًا.


=== القيمة <code>paused</code> ===
=== <code>paused</code> ===
الحركة متوقفة حاليًا توقفًا مؤقتًا.
الحركة متوقفة حاليًا توقفًا مؤقتًا.
=== البنية الرسمية ===
=== البنية الرسمية ===

مراجعة 09:30، 30 يوليو 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

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