view-transition-name

Limited availability

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

Die view-transition-name-CSS Eigenschaft weist dem ausgewählten Element einen eindeutigen Identifikationsnamen (ein <custom-ident>) zu und führt dazu, dass es an einem separaten View-Übergang vom Haupt-View-Übergang teilnimmt – oder an keinem View-Übergang, wenn der Wert none angegeben ist.

Syntax

css
/* <custom-ident> value examples */
view-transition-name: header;
view-transition-name: figure-caption;

/* Keyword value */
view-transition-name: none;

Werte

<custom-ident>

Ein Identifikationsname, der dazu führt, dass das ausgewählte Element an einem separaten View-Übergang vom Haupt-View-Übergang teilnimmt. Der Bezeichner muss eindeutig sein. Wenn zwei gerenderte Elemente zur gleichen Zeit denselben view-transition-name haben, wird ViewTransition.ready abgelehnt und der Übergang wird übersprungen.

Hinweis: Der <custom-ident> kann nicht auto sein.

none

Das ausgewählte Element wird nicht an einem View-Übergang teilnehmen.

Formale Definition

Initialer Wertnone
Anwendbar aufalle Elemente
VererbtNein
Berechneter Wertwie angegeben
Animationstypdiskret

Formale Syntax

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

Beispiele

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

Spezifikationen

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

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch