@surveyplanet/in_view NPM

In View

Check whether and element is within the browser viewport.

Install

npm install --save @surveyplanet/in-view

Example

import inView from 'in_view';

const target = document.getElementById('target', {});

document.addEventListener('scroll', (e) => {

  let isInView = inView(target, scrollOptions); \\ ture or flase
  console.log('element is in view:', isInView );

});

Options

Returns: Boolean - Whether the element is inside the document viewport or not.

Param	Type	Description
element	HTMLElement \| String	An HTMLElement or String containing a valid id (#my-elm) or class.(.my-elm) name
options	Object	function options.
options.partial	Boolean	When true the element is considered inside the viewport if any part is visible.
options.offset	Number \| String	Offset the element either by number of pixels or a percentage e.g.:'50%'

Testing

npm install
npm test

viewport scoll scrollX scollY

@everything-registry/sub-chunk-884

1.0.1

3 years ago