css-scroll-snap-polyfill
Polyfill for CSS scroll snapping draft.
Usage
Yarn
yarn add css-scroll-snap-polyfill
NPM
npm install --save css-scroll-snap-polyfill
// whenever dom is ready
Dependencies
This uses Polyfill.js by @philipwalton, which is bundled. No other dependencies.
Browser Support
This has been tested successfully in the following browsers:
- Chrome 63
- Firefox 57
- Safari 11
Standards documentation
Limitations
It will not work properly when you use margins on the scroll-snap container or it's children due to there being a mismatch between the parent and child offsets, which are used to make calculations.
This polyfill only supports the properties in the new spec, not the older deprecated
properties like scoll-snap-points
, scroll-snap-coordinate
, and scroll-snap-destination
.
If you want to use those older properties (not recommended) you can use scrollsnap-polyfill from Github user @ckrack.
Length units for scroll-padding
are limited to:
- vh/vw
- percentages
- pixels
License
MIT.