Thinking on ways to solve TOOLTIPS

18 063
9.7
Следующее
Популярные
7 дней – 2 4770:37
Getting started in Chrome DevTools
Опубликовано 5 октября 2022, 17:01
In today's GUI Challenge, @Adam Argyle builds a tooltip with a custom element (no web component!), :has(), transforms, and logical properties. Besides a small backup script for the usage of :has(), it's all CSS powered. Don't miss the screen reader experience, it got some special attention, like usual.

Chapters:
0:00 - Introduction
0:20 - Tooltips vs Toggletips
2:22 - Feature Overview
6:25 - Screen Reader UX
9:06 - Accessibility Tree
14:12 - :has()
14:55 - HTML
15:18 - CSS
18:50 - JavaScript
20:21 - Outro

Resources:
Try a demo → goo.gle/3SDW5YT
Get the source → goo.gle/3SCNxBj

Watch more GUI Challenges → goo.gle/GUIchallenges
Subscribe to Google Chrome Developers → goo.gle/ChromeDevs

#GUIchallenges #CSS #ChromeDeveloper
Случайные видео
317 дней – 4783:36
Meet Kirsi from Oulu | Nokia Finland
08.11.22 – 1650:49
Viveport - Weekly Hits
автотехномузыкадетское