TGViewer
mefody.dev mefody.dev @mefody_dev · 5.38K subscribers
Post #260 4.92K
Отличия между поповерами и диалогами

Мы в подкасте часто обсуждаем, как в браузеры внедряются поповеры (атрибут popover), которые могут заменить в каких-то случаях тултипы, а в каких-то — модальные окна. При этом есть dialog, который как будто умеет в похожую функциональность. Когда и как что применять — большой вопрос.

Зелл Лью написал заметку, которая помогает выбрать, с чем лучше работать. И с точки зрения доступности, и с точки зрения семантики.

https://css-tricks.com/clarifying-the-relationship-between-popovers-and-dialogs/

А у Ромы Ахмадуллина есть хороший доклад с обилием демок и большой сравнительной табличкой в конце, как всем этим пользоваться, что умеет каждый из подходов, можно ли уже применять в продакшене и не лучше ли просто своё кастомное использовать.

https://www.youtube.com/watch?v=x4ZCGfUZntk
CSS-Tricks Clarifying the Relationship Between Popovers and Dialogs | CSS-Tricks Pop quiz! What's the difference between a Popover element and a Dialog element? The answer is not all that clear and is widely misunderstood, but Zell has a clear way to explain it so that you know which element to reach for in your work.
  • 👍 30
  • ❤ 10
  • ❤‍🔥 4
  • ⚡ 4
  • 👏 2
  • 💯 1
More from @mefody_dev
  1. Sep 25, 2026Эффект одометра Люблю такие демки, когда на чистом CSS делают что-то необычное, для чего я…
  2. Sep 23, 2026Цена ошибок гидрации В React есть много ухищрений, чтобы серверный кусок страницы обновилс…
  3. Sep 16, 2026Какие анимации более производительные: CSS или JS? Лучше пару раз увидеть, чем много откуд…
  4. Sep 14, 2026Единица измерения lh Если коротко, то 1lh = 1 line height. И это не размер шрифта, который…
  5. Sep 11, 2026<mermaid-element> Ещё одна полезная библиотека. Брамус собрал кастомный элемент, которому…
  6. Sep 10, 2026MicroLighter Дейв Руперт собрал маленькую библиотечку, которая делает подсветку кода. «Ещё…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →