0.0.3 • Published 7 years ago
is-element-in-view v0.0.3
is-element-in-view
Detect if element is in view.
npm install is-element-in-view
Use with module packer with babel-preset-es2015
, e.g. webpack
:
import isElementInView from 'is-element-in-view
With CommonJS:
const isElementInView = require('is-element-in-view/dist/is-element-in-view')
With <script>
tag:
<script src="node_modules/is-element-in-view/dist/is-element-in-view.umd.js"
Usage
const elementInView = isElementInView(element)
/*
* returns
* {
* top: true,
* bottom: true,
* left: true,
* right: true,
* body: true,
* }
*/
if (!isElementInView(element).top) {
element.scrollIntoView()
}
Options
element
: target element.
parentElement
: optional, accepts a HTML element, if presented, will use parentElement.getBoundingClientRect()
as viewport, otherwise, use window.innerHeight
and window.innerWidth
instead.