mozilla
Vos résultats de recherche

    CSS : la propriété animation-delay

    Cette fonction est expérimentale
    Puisque cette fonction est toujours en développement dans certains navigateurs, veuillez consulter le tableau de compatibilité pour les préfixes à utiliser selon les navigateurs.
    Il convient de noter qu'une fonctionnalité expérimentale peut voir sa syntaxe ou son comportement modifié dans le futur en fonction des évolutions de la spécification.

    Résumé

    La propriété CSS animation-delay  indique quand doit commencer l'animation. Ceci permet à la séquence d'animation de débuter quelques temps après qu'elle soit appliquée à un élément.

    La valeur 0, qui est la valeur par défaut de la propriété, indique que l'animation doit commencer dès son application. Sinon, la valeur définie un décalage par rapport à l'application de l'animation à l'élément. L'animation démarre de la quantité de temps définie, après son application à l'élément.

    Lorsqu'une valeur négative est spécifiée, l'animation se lance immédiatement. Toutefois, elle semblera avoir démarré pendant le cours de l'animation.  Par exemple, si vous définissez -1s comme délai, l'animation débutera immédiatement et dans l'état défini à une seconde d'animation.

    Si vous spécifiez une valeur négative pour le délai, mais que la valeur de début est implicite alors l'instant défini comme le début est celui de l'application à l'élément.

    Il est souvent utile d'utiliser la fonction raccourcie animation afin de définir toutes les propriétés en une seule fois.

    Syntaxe

    Syntaxe formelle : <time>#
    
    animation-delay: 3s
    animation-delay: 2s, 4ms

    Valeurs

    <time>
    Le temps précisé décale le moment ou l'animation est appliquée à l’élément. Il peut être indiqué en secondes (en utilisant « s » comme unité) ou en millisecondes (en utilisant « ms » comme unité). Si aucune unité n'est indiquée, l'utilisation des secondes est supposée.

    Exemples

    Voir Animations CSS pour des exemples.

    Spécifications

    Spécification Statut Commentaire
    CSS Animations Working Draft  

    Compatibilité des navigateurs

    Fonction Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
    Support de base (Oui)-webkit 5.0 (5.0)-moz16.0 (16.0) 10 12-o
    12.10 #
    4.0-webkit
    Fonction Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
    Support de base (Oui)-webkit 5.0 (5.0)-moz
    16.0 (16.0)
    ? 12-o ?-webkit

    Voir également

    Étiquettes et contributeurs liés au document

    Contributors to this page: tregagnon
    Dernière mise à jour par : tregagnon,
    Masquer la barre latérale