interface OnScrollOptions {
    debounceWindow?: number;
    directions?: CommaSeparatedStr<ScrollDirection> | ScrollDirection[];
    scrollable?: ScrollTarget;
    skipInitial?: boolean;
    threshold?: number;
}

Properties

debounceWindow?: number

If non-0, the handler will be "debounced" so it's called at most debounceWindow milliseconds.

IMPORTANT: If the debounce window is non-0 (default), then the callback is always delayed by at least an animation frame following a scroll event to allow for optimized scrollTop/scrollLeft measurements via waitForMeasureTime.

If you set this is 0, this indicates that the callback should be "realtime" and will therefore skip waitForMeasureTime, which could lead to forced re-layouts, but you probably need this when doing scroll-based animations.

Specifies a list of ScrollDirections to listen for.

It can be a comma-separated list of direction names or an array of such names.

If not given, then it listens for scrolls in any direction, including Types.NoDirection and Types.AmbiguousDirection.

The Types.NoDirection occurs when the callback is called initially (if skipInitial is not true) and there hasn't yet been a scroll observed on the scrollable and it's scrollTop/scrollLeft are 0.

The Types.AmbiguousDirection occurs when the user scrolls diagonally with close to equal deltas in both horizontal and vertical direction.

IMPORTANT:

The direction of a scroll event is always based on comparing deltaX and deltaY relative to the last scroll event (within the debounceWindow, and not to the scroll data for the last time the callback was called (in case it was skipped because threshold was not exceeded or in case it was debounced by a larger window than the watcher).

I.e. if you have both threshold and directions restricted, or if the callback has a larger debounce window than the watcher, it is possible for there to be a change in the relevant scrollTop/scrollLeft offset that exceeds the threshold, and for the callback to not be called.

For a callback to be called, both of these must be true:

  • the change in scrollTop/scrollLeft, compared to the last time the callback was called must exceed the threshold
  • the effective scroll direction, compared to the last scroll event prior to the watcher's debounce window must be one of the given directions.
undefined
scrollable?: ScrollTarget

If it is not given, or is null, window or document, then it will track the scroll of the ScrollWatcher.fetchMainScrollableElement.

Other values must be an Element and are taken literally.

undefined
skipInitial?: boolean

Do not call the handler until there's a future scroll of the element.

By default we call the handler (almost) immediately if there's been a scroll in one of the given directions, or if there has not been a scroll but directions includes Types.NoDirection, but you can disable this initial call here.

false
threshold?: number

If non-0, the scroll handler will only be called when the scrollable's scroll offset in the observed direction has changed at least scrollThreshold pixels since the last time the handler was called.