view-transition-name

Limited availability

This feature is not Baseline because it does not work in some of the most widely-used browsers.

Expérimental: 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.

La propriété CSS view-transition-name fournit un nom d'identification (une valeur <custom-ident>) à l'élément ciblé pour qu'il participe à une transition de vue différente de la transition racine, ou ne suive pas la transition de vue si c'est la valeur none qui est utilisée.

Syntaxe

css

/* Exemples de valeurs <custom-ident> */
view-transition-name: header;
view-transition-name: figure-caption;

/* Valeurs avec un mot-clé */
view-transition-name: none;

Valeurs

<custom-ident>: Un nom distinct et unique qui indique que l'élément ciblé participera à une transition de vue séparée de la transition de vue racine. L'identifiant doit être unique. Si deux éléments affichés ont la même valeur view-transition-name au même moment, la promesse exposée par ViewTransition.ready échouera et la transition sera ignorée.
none: L'élément cible ne participera pas à la transition de vue.

Définition formelle

Valeur initiale	`none`
Applicabilité	tous les éléments
Héritée	non
Valeur calculée	comme spécifié
Type d'animation	discrète

Syntaxe formelle

view-transition-name = 
  none            |
  <custom-ident>

Exemples

css

figcaption {
  view-transition-name: figure-caption;
}

Spécifications

Specification
CSS View Transitions Module Level 1 # view-transition-name-prop

Compatibilité des navigateurs

BCD tables only load in the browser