CSS only scrollspy with :has()?
✅solved
front-end
front-endI'm aware of Sara's solution that uses scroll-marker-group, but that's experimental. Nathalie has a trick https://nathalie-trefz.de/blog/scrollspy that requires the nav to be after the sections that scroll. There's no date on the post, but I'm assuming that its been a few years. Now, though, we can select previous siblings with :has() https://tobiasahlin.com/blog/previous-sibling-css-has/ it should be possible, no?
Experimenting, I scaled from menu navigation and sections back to just the menu siblings and could get menu one to change when hovering menu three, but no luck the other way around.
(this works)
(this does not)
Not meant to be or am I doing something wrong?
Experimenting, I scaled from menu navigation and sections back to just the menu siblings and could get menu one to change when hovering menu three, but no luck the other way around.
(this works)
(this does not)
Not meant to be or am I doing something wrong?
Selecting a previous sibling was for long impossible, but is now a breeze with the has() pseudo-class
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
