whenInViewport

Type:Function

Status:stable

Since:1.0.0

Platform:js

@blackbyte.sugar.js.dom.when

Monitor an HTMLElement to be notified when it is in the viewport

Params

$elm*-HTMLElement
The element to monitor
settings{}Partial<TWhenInViewportSettings>
Some settings to tweak the detection behavior

Return

-(SPromise<HTMLElement>)
The promise that will be resolved when the element is in the viewport

Example

import { whenInViewport } from '@blackbyte/sugar/dom'
const promise = whenInViewport($myCoolHTMLElement).then((elm) => {
  // do something with your element that has entered the viewport...
});
// when you want to stop listening
promise.cancel();

Settings

offset’10px’String
An offset to detect sooner or later the element entering in the viewport
[whenIn]*-Function
A callback function to call when the element enter the viewport
[whenOut]*-Function
A callback function to call when the element leave the viewport
oncetrueBoolean
Specify if the promise should be resolved only once (the first time the element enter the viewport)

Todo

testsnormal

Author

Olivier Bosselolivier.bossel@gmail.com https://blackbyte.space