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