General API

toScroll()

async

Scrolls the document or a matched DOM element to the target DOM element or coordinates.

  • Accepts an optional single argument as an object with the following options:
    Option
    Type
    Default
    Description
    target
    DOM element
    null
    Specifies the target DOM element to scroll to.
    If not specified, scrolling moves to the end in the direction specified by the "align" property.
    speed
    number
    300
    Scrolling speed in milliseconds.
    type
    'smooth'
    'ease'
    'linear'
    'smooth'
    The type of scrolling animation.
    align
    'top'
    'bottom'
    'left'
    'right'
    'center'
    'top'
    'left'
    Sets the alignment of the target DOM element specified by the "target" property. If no "target" is set, it scrolls in the defined direction.
    offset
    number
    0
    Scrolls to the target DOM element specified in "target" and by the specified number of pixels. If no "target" is set, it scrolls in the specified "align" direction and by the specified number of pixels.
    axis
    'Y' or 'X'
    'Y'
    The scroll axis.
    All options are optional.
  • Allows waiting for the scroll to complete using await.
Example:
toScroll();
// Scrolls the document with default values.

$('div').toScroll();
// Scrolls the <div> element with default values.

toScroll({target: $('div'), speed: 200});
// Scrolls the document to the <div> element in 200 milliseconds.

toScroll({target: $('div'), align: 'center'});
// Scrolls the document so that the <div> element is in the center of the scroll.

toScroll({target: $('div'), offset: -100});
// Scrolls the document to the <div> element and then scrolls back by 100px.

toScroll({offset: 100});
// Scrolls the document to the top and then an additional 100px.

$('div').toScroll({target: $('span')});
// Scrolls the <div> element to bring the <span> element into view.

$('div').toScroll({align: 'right', axis: 'X'});
// Scrolls the <div> element along the X-axis to the end.

await $('div').toScroll({type: 'ease'});
// Scrolls the <div> element to the top with the animation type 'ease' and waits for the scrolling to complete.

await toScroll();
// Scrolls the document to the top with default values and waits for the scrolling to complete.