w3c / csswg-drafts

CSS Working Group Editor Drafts
https://drafts.csswg.org/
Other
4.5k stars 665 forks source link

[css-scroll-snap] scroll snap animation #11096

Open NicTanghe opened 2 weeks ago

NicTanghe commented 2 weeks ago

a way to animate the spline that is being to center on the entry it snaps on. so that you can add some overshoot

EDIT: the original problem i was facing is a problem with firefoxes implementation.

Hello trying to make some css layout with a bunch of links that you can scroll horizontally. I was surprised to find out you can really only configure scrolling 1 by 1 without having links cut off.

Without having to write a bunch of custom logic.

I think that a new scroll-snap type would fix this

scroll-snap-type: end

It would just let you normal scroll until you stop scrolling and then snap to the end so that nothing is cut off.

(note that i am testing on a mouse pad so it might be a bug where something doesn`t work on ff)

NicTanghe commented 2 weeks ago

could also be great to lett us tweak the s curve on the position/speed for when it takes over the position when you let go.

fantasai commented 2 weeks ago

The relevant spec is scroll-snap, fwiw. https://www.w3.org/TR/css-scroll-snap-1/

But I'm having trouble understanding what you're requesting. Can you explain it with an example and some more details, please?

NicTanghe commented 2 weeks ago

OK instead of like snapping every entry. an option so that you can scroll in normal mode but it centers the last entry like a wheel of fortune that perfectly centers.

an animation option would be how it go`s from the position you leave it at to how you want it centered with an s curve.

I could add more detail on the animation s curve thing but i want to make sure the core concept is clear first.

Op di 29 okt 2024 om 19:58 schreef fantasai @.***>:

The relevant spec is scroll-snap, fwiw. https://www.w3.org/TR/css-scroll-snap-1/

But I'm having trouble understanding what you're requesting. Can you explain it with an example and some more details, please?

— Reply to this email directly, view it on GitHub https://github.com/w3c/csswg-drafts/issues/11096#issuecomment-2445095560, or unsubscribe https://github.com/notifications/unsubscribe-auth/ADH6HSPJ36KWMX7VM3IEQNLZ57LGXAVCNFSM6AAAAABQU7YTF6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDINBVGA4TKNJWGA . You are receiving this because you authored the thread.Message ID: @.***>

NicTanghe commented 1 week ago

Ok so the slowing down and manditory locking being weird and finicky seems to be a Firefox problem.

The feature request for allowing an animation on the centering still stands.

I realise the request is now confuzing and i wil restructure it.