#статья дня В Chrome 114, вышедший вот буквально пару недель | Будни разработчика

#статья дня

В Chrome 114, вышедший вот буквально пару недель назад, приземлился крайне любопытный атрибут: popover. Что это такое? Давайте посмотрим.

Добавленный элементу атрибут popover превратит его в неблокирующий (об этом ниже) диалог, удобный для меню, выбора вариантов, уведомлений, или отображения вспомогательных элементов формы. Собственно, сразу пример кода:

Click me



Что мы получаем из коробки:
- Никакого теребоньканья скриптов
- Никаких игр в z-index: 10000: всплывашке будет выдан свой слой
- Клик вне элемента скроет его (нативный onClickOutside)
- Захват фокуса и esc для закрытия

В отличие от dialog, как я уже сказал выше, всплывашка не блокирует взаимодействие со страницей и дополнительного контроля со стороны JS API не предоставляет. Dialog сильно старее и довольно спорен в целом.

В общем, читаем блог разработчиков Chrome:
https://developer.chrome.com/en/blog/introducing-popover-api/

#css #html #popover