SnapEvent: SnapEvent() constructor
Limited availability
This feature is not Baseline because it does not work in some of the most widely-used browsers.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The SnapEvent()
constructor creates a new
SnapEvent
object instance.
Syntax
new SnapEvent(type, init)
Parameters
type
-
A string representing the type of event. For
scrollsnapchanging
events, this isscrollsnapchanging
. Forscrollsnapchange
events, this isscrollsnapchange
. init
-
An object containing the following properties:
snapTargetBlock
Optional-
Returns a reference to the element snapped to in the block direction when the event fired, or
null
if scroll snapping only occurs in the inline direction so no element is snapped to in the block direction. snapTargetInline
Optional-
Returns a reference to the element snapped to in the inline direction when the event fired, or
null
if scroll snapping only occurs in the block direction so no element is snapped to in the inline direction.
Examples
A developer would not use this constructor manually. A new SnapEvent
object is constructed when a handler is invoked as a result of the scrollsnapchanging
or scrollsnapchange
events firing.
For example:
mainElem.addEventListener("scrollsnapchange", (event) => {
// ...
// Log a SnapEvent object instance to the console
console.log(event);
});
Specifications
Specification |
---|
CSS Scroll Snap Module Level 2 # dom-snapevent-snapevent |
Browser compatibility
BCD tables only load in the browser
See also
scrollsnapchanging
eventscrollsnapchange
event- CSS scroll snap module
- Scroll Snap Events on developer.chrome.com (2024)