UNPKG

@surveyplanet/in_view

Version:

Check whether an element is inside the browser's viewport.

43 lines (28 loc) 1.48 kB
# In View Check whether and element is within the browser viewport. ## Install ``` npm install --save @surveyplanet/in-view ``` ## Example ```js 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**: <code>Boolean</code> - Whether the element is inside the document viewport or not. | Param | Type | Description | | --------------- | ----------------------------------------------- | -------------------------------------------------------------------------------- | | element | <code>HTMLElement</code> \| <code>String</code> | An HTMLElement or String containing a valid id (#my-elm) or class.(.my-elm) name | | options | <code>Object</code> | function options. | | options.partial | <code>Boolean</code> | When true the element is considered inside the viewport if any part is visible. | | options.offset | <code>Number</code> \| <code>String</code> | Offset the element either by number of pixels or a percentage e.g.:'50%' | ## Testing ``` npm install npm test ```