Spec-Zone.ru › Web APIs

NavigateEvent: свойство hasUAVisualTransition

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

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

  • Подробнее
  • Полная совместимость
  • Отправить отзыв

Экспериментально: Это экспериментальная технология
Перед использованием в продакшене внимательно проверьте таблицу совместимости браузеров.

Чтение только свойство hasUAVisualTransition интерфейса NavigateEvent возвращает значение true если пользовательский агент выполнил визуальную транзицию для этого перехода перед отправкой события, или false в противном случае.

Пользовательские агенты могут предоставлять встроенную визуальную транзицию при выполнении навигации по сайту. Если автор сайта также добавляет визуальную транзицию, транзиции пользовательского агента и автора могут конфликтовать и сбивать с толку посетителя. Это свойство позволяет обнаружить, была ли предоставлена транзиция UA, чтобы вы могли пропустить транзиции автора для лучшего пользовательского опыта.

Значение

Булево значение.

Примеры

navigation.addEventListener("navigate", (event) => {
  // Some navigations, e.g. cross-origin navigations, we
  // cannot intercept. Let the browser handle those normally.
  if (!event.canIntercept) {
    return;
  }

  // Don't intercept fragment navigations or downloads.
  if (event.hashChange || event.downloadRequest !== null) {
    return;
  }

  event.intercept({
    handler() {
      // Fetch the new content
      const newContent = await fetchNewContent(event.destination.url, {
        signal: event.signal,
      });

      // The UA does not support View Transitions, or the UA
      // already provided a Visual Transition by itself (e.g. swipe back).
      // In either case, update the DOM directly
      if (!document.startViewTransition || event.hasUAVisualTransition) {
        doSinglePageAppNav(newContent);
        return;
      }

      // Update the content using a View Transition
      document.startViewTransition(() => {
        doSinglePageAppNav(newContent);
      });
    },
  });
});

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

Спецификация
HTML
# dom-navigateevent-hasuavisualtransition

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

Рабочие столы Мобильные устройства
Chrome Edge Firefox Opera Safari Chrome Android Firefox для Android Opera Android Safari на iOS Samsung Internet WebView Android
hasUAVisualTransition 118 118 Нет 104 Нет 118 Нет 79 Нет 25.0 118

См. также

  • Современное маршрутизирование на стороне клиента: API навигации
  • Описание API навигации
  • Демонстрация API навигации Domenic Denicola
  • Визуальные переходы для страниц одного документа для одностраничных приложений

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

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API