Great to see this proposed (many people are using it nowadays, boosted by the iPhone 5s page).
.gallery {
scroll-snap-type: mandatory;
scroll-snap-points-x: snapList(786px, 1643px, 2483px, 3264px, 4054px, 4402px);
}
Don’t like the fact that one needs to specify explicit values (be it in pixels, ems, or percentages), as not all children can be of the same height/width for example (think a set of images placed horizontally next to eachother: some may be in landscape and some in portrait mode). To bypass this a CSS (direct) child selector would seem more appropriate (just a proposal I’m making here):
.gallery {
scroll-snap-type: mandatory;
scroll-snap-points-x: '> article';
}
Looking forward to see where this is headed.
Setting native-like scrolling offsets in CSS with Scrolling Snap Points →
CSS Scroll Snap Points Module Level 1 →
Leave a comment