English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
CSS3 animation-play-L'attribut state indique si l'animation doit être jouée ou arrêtée.
Le tableau suivant résume l'utilisation de cet attribut et l'historique des versions.
Valeur par défaut : | running |
---|---|
Appliqué à : | Tous les éléments ::before et ::after Élément factice |
Héritage : | Aucun |
Réalisation animée : | Non.请参见 Veuillez voir。 |
Attributs d'animation | CSS3Version : |
Nouvelle fonction de JavaScript | object object.style.animationPlayState="paused" |
La syntaxe de cet attribut est la suivante :
animation-play-state: paused | running | initial | inherit
Les exemples suivants montrent comment utiliser l'animation-play-attribut state.
.box { width: 50px; height: 50px; background: red; position: relative; /* Chrome, Safari, Opera */ -webkit-animation-name: moveit; -webkit-animation-duration: 2s; -webkit-animation-play-state: paused; animation-name: moveit; animation-duration: 2s; animation-play-state: paused; } /* Chrome, Safari, Opera */ @-webkit-keyframes moveit { from {left: 0;} to {left: 50%;} } @keyframes moveit { from {left: 0;} to {left: 50%;} }Testez pour voir‹/›
Le tableau suivant décrit les valeurs de cet attribut.
Valeur | Description |
---|---|
paused | Spécifie que l'animation est en pause. |
running | Spécifie que l'animation est en cours d'exécution. C'est la valeur par défaut. |
initial | Réinitialisez cette propriété à sa valeur par défaut. |
inherit | Si spécifié, l'élément lié utilise l'animation de son élément parent-play-valeur calculée de l'attribut state. |
Attention :animation-play-L'attribut stateCSS peut être utilisé avec JavaScript pour arrêter l'animation au milieu d'une boucle.
animation-play-Compatibilité du navigateur pour l'attribut state, tous les navigateurs populaires prennent en charge cette propriété.
|
Veuillez consulter les tutoriels suivants :CSS3Animation。
Attributs et règles associés :animation-name,animation-duration,animation-timing-function,animation-delay,animation-iteration-count,animation-direction,animation-fill-mode,animation-play-state,@keyframes。