Search code examples
csspolyfills

How to emulate CSS Scroll Snap Points in Chrome?

Firefox 39, Safari 9 and IE11 provide support for CSS Scroll Snap Points. Chrome has the feature in development.

Is there a polyfill that would emulate the following CSS styles:

-webkit-scroll-snap-type: mandatory;
-ms-scroll-snap-type: mandatory;
scroll-snap-type: mandatory;
-webkit-scroll-behavior: smooth;
-ms-scroll-behavior: smooth;
scroll-behavior: smooth;
-webkit-scroll-snap-points-y: repeat(600px);
-ms-scroll-snap-points-y: snapInterval(0px, 600px); /* Old syntax */
scroll-snap-points-y: repeat(600px);
overflow-y: auto;
overflow-x: hidden;

until the feature is implemented by Chrome?

Solution

  • Chrome 69 will contain the feature. No workaround needed.

    Just sit and wait. Just sit and wait :-)