Re: [csswg-drafts] [css-overflow-5] Scroll-markers (#10720)

I really like the idea of the scroll markers, although I am a bit wary of the dynamically created interactive elements, I'll copy the [comment I did in the related thread](https://front-end.social/@kizu/111564320833361099) from last December: 

> I don't like the idea of having the interactive elements created as pseudo-elements, or a need to manually place elements and then somehow associate them with the fragments etc.
>
> But what if (wild idea incoming)… an ability to declare a `<template>` which would be used for every fragment? Maybe even with some built-in slot content that could be used, like for the markers, “page count” etc.

(there was a bit more to the discussion in the thread, I won't copy it fully)

However, regardless of how the actual dynamic scroll-markers will be implemented (maybe there is a way for the browsers to expose them in an accessible and extensible way), I think there is one thing about this proposal that **we could implement right now** — the idea of a `:checked` pseudo-class for the current marker:

> Within each group, an active marker is determined based on the scroll position and can be styled by the developer using the :checked pseudo-class, e.g.

This pattern is something that gets re-implemented over and over again, in our App I remember it appearing in different forms at least three times in the last 2 months.

I did also successfully implement this pattern with scroll-driven animations in the past: https://kizu.dev/scroll-driven-animations/#table-ofcontents-with-highlighted-current-sections — so it is already possible today (in Chrome) with just CSS. But it is _very awkward_ to implement even with the scroll-driven animations, so having a native feature like this could be very useful.

Thus, my proposal: split the `:current` state as something that could be the least questionable to implement (this could be a quick win), and continue discussing the dynamic scroll-markers themselves separately (as in my opinion there is much more to them that we need to think about, and I don't want them to stall what the `:checked` could bring).

-- 
GitHub Notification of comment by kizu
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/10720#issuecomment-2315589834 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 28 August 2024 14:52:37 UTC