scrollTrigger

scrollTrigger

Yet another scroll trigger js tool. When an element gets to a certain point in the viewport (crosses a trigger line) run a function.

Constructor

new scrollTrigger(override)

Source:
Example
// Showing default parameters.
const ST = new scrollTrigger({
      eventName: 'scrollTrigger',
      offset: 0,
      position: 'center',
      probe: false,
      selector: '[data-scroll-trigger]'
  });
Parameters:
Name Type Description
override stOptions

stOptions

Methods

(static) generateElementsObj(selector) → {Array.<stElement>}

Source:

Generate elements array. Each element is wrapped in a an stElement object. The idea is to precalculate offset position, so that scrolling performance is not impacted by multiple calls to getBoundingClientRect().

Parameters:
Name Type Description
selector string

Elements selector.

Returns:

An array of stElements

Type
Array.<stElement>

_getTriggerLine(position) → {number}

Source:

Get Trigger Line position in pixels.

Parameters:
Name Type Description
position string

Position option.

Returns:
  • Trigger Line position in pixels
Type
number

onScrollProbe()

Source:

Method to run on document scroll if probe is set to true. Dispatches custom event named by 'options.eventName'.

Fires:

onScrollResize()

Source:

Method to run on document resize if elements are found by _getTriggerLine. It recalculates the window size, trigger line position and each elements offset.

onScrollTrigger()

Source:

Method to run on document scroll if elements are found by _getTriggerLine. Dispatches custom event named by 'options.eventName'.

Fires: