Revealing the Differences between HTML Dialogs and the Popover API

Подписаться 101 тыс.

Просмотров 7 тыс.

50% 1

The fully supported HTML dialog element and the newly released Popover API have some overlapping functionality but also a lot of unique features. Watch this to understand the differences.
Code from video: gist.github.com/prof3ssorSt3v...
MDN reference for dialog element: developer.mozilla.org/en-US/d...
MDN reference for popover api: developer.mozilla.org/en-US/d...
CanIUse coverage for popover api: caniuse.com/mdn-api_htmleleme...
0:00 Intro
0:45 Dialog element
4:45 Default Styling
6:00 Modal Concepts
8:27 Dialog Events
9:20 Dialog Return Values
11:55 Dialog Open Attribute
13:15 Popover API
16:18 popovertargetaction
18:00 Popover Events
21:21 More Styling

Опубликовано:

30 июн 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 16

@Pareshbpatel 3 месяца назад

The Dialog HTML Element and Popover API, explained so clearly. Thanks, Steve {2024-03-20}

@kerrykreiter445 Год назад

Thanks! Really needed this info. Thinking of using dialogs in my JS game designs

@mandardeshpande7976 Год назад

I am more excited for that thumbnails of your videos rather than video itself :)

@pauloheres 7 месяцев назад

amazing video as always! Tks

@NARAYANAREDDY-FEdev 9 месяцев назад

Great video! Thank you so much ❤

@danielChibuogwu Месяц назад

Thank you for this 🙏🏾🫡🚀🚀🚀🚀

@AlexBodrovFamily 7 месяцев назад

This is awesome ❤ Thank you!

@TomHallOnline 7 месяцев назад

Very nice video. I had searched for quite some time for such a tutorial. I was a bit disappointed that your did not show how to position a popover relative to the button. Ideally, I would like a popover that appears as a submenu under the button that was clicked.

@SteveGriffith-Prof3ssorSt3v3 7 месяцев назад

To position a popover relative to the target of the click or mouseover event, then you need to do that through JavaScript. In this other video - ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-hrYhX3KEQTc.html - I talk about getting position information from mouse events. Then you can directly set the position of the popover.

@thommccarthy1139 Год назад

Great vid. Neither will be recommended for WCAG within the next ten years likely so for the time being it's just a novelty.

@SteveGriffith-Prof3ssorSt3v3 Год назад

As long as it gets browser support and passes 90% coverage it will be a reality for developers.

@DK-ts1rj Год назад

Hey steve, I was learning java for about 10 days and today I see on the internet that kotlin is better then java so i'm thinking like should I switch to kotlin or continue with it because I have an idea for an application and i want to implement that idea until the end of this year so just answer me like should I continue or not

@SteveGriffith-Prof3ssorSt3v3 Год назад

If you want to build Android apps then definitely switch to Kotlin

@33v4. Год назад

hi teacher where are you? we miss you! btw I was trying to use dev tools debugger today and it's really complex but also very powerful, I wonder if you will make more videos about the gazillion features we have available using dev tools?

@SteveGriffith-Prof3ssorSt3v3 Год назад

I'm still here. 😀 Tons of videos still to make. I'm just busy lately writing a book on Flutter for web developers.

@33v4. Год назад

@@SteveGriffith-Prof3ssorSt3v3 looking forward to it!!