view-transition-name

Ограниченная доступность

Эта функция не относится к Baseline, так как она не работает в некоторых из наиболее широко используемых браузеров.

Свойство view-transition-name CSS обеспечивает выбранному элементу уникальное идентифицирующее имя (а <custom-ident>) и заставляет его участвовать в отдельной переходе представления от корневого перехода представления — или без перехода представления, если указано значение none.

Синтаксис

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

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

Значения

<custom-ident>: Идентифицирующее имя, которое заставляет выбранный элемент участвовать в отдельном переходе представления от корневого перехода представления. Идентификатор должен быть уникальным. Если два рендеренных элемента имеют одинаковое view-transition-name одновременно, ViewTransition.ready отклонит запрос, и переход будет пропущен.

Примечание: <custom-ident> не может быть auto.
none: Выбранный элемент не будет участвовать в переходе представления.

Формальное определение

Начальное значение	`none`
Применяется к	всем элементам
Наследуется	нет
Вычисленное значение	как указано
Тип анимации	дискретный

Формальный синтаксис

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

Примеры

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

Спецификации

Спецификация
CSS View Transitions Module Level 1 # view-transition-name-prop

Совместимость браузеров

	Рабочие столы					Мобильные устройства
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`view-transition-name`	111	111	Нет	97	18	111	Нет	75	18	22.0	111
`none`	111	111	Нет	97	18	111	Нет	75	18	22.0	111

См. также

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/view-transition-name