Interactions
JavaScript is a handy instrument, but writing hundreds of lines of code just to emulate something that should be handled by the browser can sometimes feel like trying to swat flies with a sledgehammer.
Thanfully CSS is catching up, and properties like CSS Scroll Snap give you more control over the browser's behavior, without having to write a single line of JavaScript.
Usage Overview
The size of the outer circle corresponds to the total number of users who know about a feature, while the inner one represents those who have actually used it.
Hover on each node to view detailed data along with an overlay representing the total number of survey respondents.
Usage by Years Of Experience
The “overall” column shows overall usage for each feature (respondents who selected “have used it”), while the following columns show the usage ratio for each “years of experience” bracket.
A brighter pink background indicates a higher-than-overall-average ratio for a given bracket.
Scroll Snap
CSS Scroll Snap is a module of CSS that introduces scroll snap positions, which enforce the scroll positions that a scroll container’s scrollport may end at after a scrolling operation has completed.
Learn More
overscroll-behavior
The overscroll-behavior
CSS property sets what a browser does when reaching the boundary of a scrolling area. It's a shorthand for overscroll-behavior-x
and overscroll-behavior-y
.
Learn More
overflow-anchor
The overflow-anchor
CSS property provides a way to opt out of the browser's scroll anchoring behavior, which adjusts scroll position to minimize content shifts.