coderef

Scroll snap eventsLimited availability

The scrollsnapchanging and scrollsnapchange events fire when a scroll gesture changes the selected scroll snap target.

Not yet supported in all major browsers — check the table and provide a fallback.

How to use ↓Compare browsers

Browser support

DesktopChrome
1–128Not supported
129+Supportedsince Sep 17, 2024
Current: 155
Edge
12–128Not supported
129+Supportedsince Sep 19, 2024
Current: 154
Firefox
✕Not supportedup to 157
Current: 157
Safari
✕Not supportedup to 27
Current: 27
MobileChrome Android
18–128Not supported
129+Supportedsince Sep 17, 2024
Current: 155
Firefox Android
✕Not supportedup to 157
Current: 157
Safari iOS
✕Not supportedup to 27
Current: 27

How to use

Not supported in Firefox, Safari, Firefox Android, Safari iOS. Use feature detection below and provide a fallback (or a polyfill) for those browsers.

Example

Full syntax and examples are on MDN: scrollsnapchange event.

Feature detection

JS · check before using
if ("onscrollsnapchange" in Document.prototype) {
  // the scrollsnapchange event is supported
}

Documentation (MDN)

Specification

Sub-features

Support for each part of the feature (10). The overall table above shows when the whole feature works.

Sub-featureChromeEdgeFirefoxSafariChrome AndroidFirefox AndroidSafari iOS
Document.scrollsnapchange_event129129✕✕129✕✕
Document.scrollsnapchanging_event129129✕✕129✕✕
Element.scrollsnapchange_event129129✕✕129✕✕
Element.scrollsnapchanging_event129129✕✕129✕✕
SnapEvent129129✕✕129✕✕
SnapEvent.SnapEvent✕✕✕✕✕✕✕
SnapEvent.snapTargetBlock129129✕✕129✕✕
SnapEvent.snapTargetInline129129✕✕129✕✕
Window.scrollsnapchange_event129129✕✕129✕✕
Window.scrollsnapchanging_event129129✕✕129✕✕