Practical CSS Scroll Snapping
CSS scroll snapping allows you to lock the viewport to certain elements or locations after a user has finished scrolling. It’s great for building interactions like this one:…
CSS scroll snapping allows you to lock the viewport to certain elements or locations after a user has finished scrolling. It’s great for building interactions like this one:…
This is an interesting read on the current state of scrollbars and how to control their behavior across operating systems and browsers. The post also highlights a bunch of stuff I didn’t know about, like Element.scrollIntoView()
and the scroll-behavior
CSS …
Over on the MediaTemple blog, I show you how you can make a pretty decent little carousel with just a few lines of code. Here’s the entire premise:
…Every time a carousel is mentioned in a blog post, it’s a
Before this new CSS I’m about to introduce existed, locking an element into the viewport on scroll required rigging up some JavaScript. As you may know, JavaScript has a well-earned reputation to be tricky when paired with scrolling behavior.
The …
Guil Hernandez introduces how easy sliders (with nice UX) will be with very simple HTML and CSS’ brand new scroll-snap-*
properties. CSS is moving fairly fast these days, with features like this moving from “never heard of it” to:
……
The newly-introduced CSS “snap points” properties could make it a whole lot easier to create CSS-only scroll effects (once browser support catches up). This post from Sergey Gospodarets’ blog includes demos of snappy scrolling for image galleries and full-page vertical …
By now, any article about carousels should come with the disclaimer: You may not need a carousel. Carousels are easily abused. Kyle Peatt has more details on the carousel controversy.
Part of the blame can be put on the user …