Mastodawn

Es freut mich so sehr, dass #Firefox mit 147 meine beiden neuen Lieblings-Features unterstützt!
#ViewTransitionAPI und jetzt auch #AnchorPositioning (gerade für #PopoverAPI).

In diesem Artikel gehe ich auf View Transition API ein, erwähne aber auch anfangs Popover API: https://site.lgk.io/blog/2025-06-01-view-transition-api/

Sanfte Übergänge mit View Transition API

Nerd, designer and developer or just a guy who loves to be creative.

Lars' Portfolio

Inautilo Dec 1

#Development #Pitfalls
Top layer troubles, popover vs. dialog · How to avoid possible conflict points https://ilo.im/168t8f

_____
#TopLayer #HtmlDialog #PopoverAPI #Modals #Browser #WebDev #Frontend #HTML #CSS #JavaScript

Top layer troubles: popover vs. dialog - HTMHell

A collection of bad practices in HTML, copied from real websites.

Top layer troubles: popover vs. dialog - HTMHell

Matthias Zöchling Feb 21, 2025

In case you are wondering why I’m relatively silent in 2025 (especially compared to last year), no reason.

At the moment I’m still having “fun” with the Popover API, I’ve just filed a Firefox issue:
https://cssence.com/2025/popover-shift-tab-issue/

#WebDev #PopoverAPI #Firefox

The Popover API and Firefox’s Shift+Tab trap

If it looks like a bug, smells like a bug, and quacks like a bug, then it probably is a bug.

westbrook Nov 11, 2024

Do you, also, develop with the #popoverAPI?

Do you do so in conjunction with IFRAMEs?

Possibly without thinking about it via #storybook?

Have you, also, run into this #Chromium bug with DevTools? https://issues.chromium.org/issues/378330033

+1s and CC adds are a great way to speed implementors on the path towards a fix. 🙇

#webDev #componentBasedDevelopment #developingDesignSystems

Chromium

pablolarah Oct 10, 2024

🎉 The Popover API: Your New Best Friend for Tooltips

by Sjoerd Beentjes at De Voorhoede

@devoorhoed @devoorhoede

#PopoverAPI #popover #css #webdev

https://www.voorhoede.nl/en/blog/the-popover-api-your-new-best-friend-for-tooltips/

The Popover API: Your New Best Friend for Tooltips

Discover how the Popover API and new CSS features simplify tooltip creation, making them accessible and well-positioned across all major browsers

pablolarah Oct 10, 2024

🔴🔵🟡 Developing modals using only CSS and the Popover API

by Daniel Schwarz @mrdanielschwarz at @logrocket

#modal #CSS #PopoverAPI #webdev

https://blog.logrocket.com/developing-modals-using-only-css-popover-api/

Developing modals using only CSS and the Popover API - LogRocket Blog

The Dialog and Popover approach to modals requires less code and and fewer files than using JavaScript method, making it less error-prone.

LogRocket Blog

pablolarah Aug 3, 2024

🟣 Popover API 101
by Amit Merchant
@amit_merchant
#PopoverAPI #webdev #css

https://www.amitmerchant.com/popover-api-101/

Popover API 101

Browsers have been getting some pretty important features at a rapid pace lately. Features that might take several JavaScript (or CSS) libraries to implement are now available in browsers out of the box.

Amit Merchant

CuriousCoder Jul 2, 2024

The popover API has been added just recently as Baseline 2024 for all major browsers.
So you don't have to write all the tricky code for open/close mechanism and accessibility yourself.

Check it out: https://web.dev/blog/popover-api

#webdev #JavaScript #HTML #CSS #PopoverAPI #programming

Popover API lands in Baseline | Blog | web.dev

The popover API lands in all modern browser engines.

web.dev

Inautilo Jun 27, 2024

#Development #Guides
Poppin’ In · Say hello to the handy new Popover API https://ilo.im/15zboz

_____
#Navigation #Tooltip #Dialog #PopoverAPI #Browser #WebDev #Frontend #HTML #CSS

Poppin' In | CSS-Tricks

Oh, hey there! It’s been a hot minute, hasn’t it? Thought I’d pop in and say hello while we get to know the Popover API a bit.

CSS-Tricks

pablolarah May 13, 2024

🔴🔵🟡 Popover API
at MDN Web Docs
@MozDevNet
#PopoverAPI #css #webdev

https://developer.mozilla.org/en-US/docs/Web/API/Popover_API

Popover API - Web APIs | MDN

The Popover API provides developers with a standard, consistent, flexible mechanism for displaying popover content on top of other page content. Popover content can be controlled either using HTML attributes, or via JavaScript.

MDN Web Docs