KPC
Kevin Powell - Community•9mo ago
Chaves

How does this accessible navigation work?

Guys, is this accessible navigation "button" difficult to make? It works as follows, when you scroll with TAB, it presents other sections for you to navigate such as, Go to main menu, Go to page content, go to footer
No description
No description
2 Replies
ἔρως
ἔρως•9mo ago
it's a link that's "hidden" by using clip-path and other styles to make it as tiny as possible (preferably even move it out of the document layout by using position: absolute) it's the very first thing inside the body it points to the main component, by id when it is focused, the styles added before are all removed, and the only way to do it is to press tab
13eck
13eck•9mo ago
https://www.youtube.com/watch?v=jDDaOFr9nqQ
Kevin Powell
YouTube
Most sites have a skip-to-main link, and yours should too!
The 'skip navigation' or 'skip to main content' link is everywhere on the web, but why do so many sites have it, and how can you add one to your own projects? 🔗 Links ✅ Accessibility with Ashlee Boyer: https://youtu.be/qr0ujkLLgmE ✅ Smooth scrolling with CSS: https://youtu.be/MNNr7TU7XcU ⌚ Timestamps 00:00 - Introduction 00:50 - Adding ...
Want results from more Discord servers?
Add your server
More Posts
Sticky flickering on Chrome Mobile ViewHello everyone, is there any way to prevent this flickering from occurring when scrolling down usingNeed FrontEnd AdviceI need some advice, i am working on a frontend of a project, i am using html, css and js for it. TheWhat is the difference between align-content and align-items?What is the difference between align-content and align-items?Advanced background coloring helpMy designer gave me a landing page in Figma, and as you can see in the picture, there are seemingly can you have an if else statement inside this ```style={{ }}```i was wondering if you can do an if else statement inside ```style={{ }}```, like do this static colI am stuck on this challenge help meI have attached event handler to the noOfPeople input and in the event handler I call another functiChange column order in mobile viewHi, I'm a beginner and I'd like to swap around two columns in the mobile version of this page: httpHelp me choose between two designsThis is a website I just practicing on but I can't decide which one might better or both of them areTypical starting template for creating a div container on an entire page?Morning I always mess this up somehow, my typical start is below: ```js <body> <div class="contaA question about getting Sass setupDo you alway install sass when you use it or will it always be stored on your pc? I'm using VSCode.