StuckObserver

StuckObserver Extends IntersectionObserver

Extends IntersectionObserver to default callback to toggle a designated class when element is stuck

Constructor

new StuckObserver(optionsopt) → {StuckObserver}

Parameters
Name Type Attributes Default Description
options Object <optional>
 {}

Configuration options

Name Type Attributes Default Description
root Element <optional>

Same as IntersectionObserver
top number <optional>
 1

Pixel inset into root to determine sticky state
right number <optional>
 -9999

Pixel inset into root to determine sticky state, default essentially removes it as a boundary
bottom number <optional>
 -9999

Pixel inset into root to determine sticky state, default essentially removes it as a boundary
left number <optional>
 -9999

Pixel inset into root to determine sticky state, default essentially removes it as a boundary
class string <optional>
 "stuck"

Class to toggle, when stuck, class is added
Returns
StuckObserver -

StuckObserver instance
Example
const observer = new StuckObserver(options={})
const el = createElement({style: {position: 'sticky', top: 0}})
observer.observe(el)
Source: StuckObserver.js, line 19

Methods

observe(el, callbackopt)

Extends IntersectionObserver.observe to add a callback option that is called every time stuck status is changed

Parameters
Name Type Attributes Description
el HTMLElement

Element to observe
callback function <optional>

Callback function that receives stuck status (true|false) as argument
Source: StuckObserver.js, line 50