1. Web
  2. CSS
  3. Référence
  4. Règles @
  5. @view-transition

Cette page a été traduite à partir de l'anglais par la communauté. Vous pouvez contribuer en rejoignant la communauté francophone sur MDN Web Docs.

View in English Always switch to English

Règle CSS @view-transition

Disponibilité limitée

Cette fonctionnalité n'est pas Compatible car elle ne fonctionne pas dans certains des navigateurs les plus utilisés.

Vous voulez une meilleure prise en charge pour cette fonctionnalité ? Dites-nous pourquoi.

La règle @ CSS @view-transition est utilisée pour choisir les documents actuels et de destination qui subiront une transition d'affichage, dans le cas d'une navigation entre plusieurs documents.

Pour qu'une transition d'affichage inter-document fonctionne, les documents actuel et de destination de la navigation doivent être sur la même origine.

Syntaxe

css
@view-transition {
  navigation: auto | none;
  types: none | <custom-ident>#;
}

Descripteurs

Un mot-clé définissant l'effet que cette règle @ aura sur le comportement de transition d'affichage du document. Les valeurs possibles sont :

auto

Le document subira une transition d'affichage lorsqu'il prendra part à une navigation, à condition que celle-ci soit de même origine, sans redirections inter-origines, et que son navigationType soit traverse, push, ou replace. Dans le cas de push ou replace, la navigation doit être initiée par un·e utilisateur·ice interagissant avec le contenu de la page, et non par une fonctionnalité de l'interface utilisateur du navigateur.

none

Le document ne subira pas de transition d'affichage.

types

Définit les types de transition d'affichage à définir pour la transition d'affichage active des documents actuel et de destination. Les valeurs possibles sont :

<custom-ident>+

Une ou plusieurs valeurs <custom-ident> séparées par des espaces représentant les types à définir.

none

Aucun type n'est défini.

Syntaxe formelle