@opuu/inview

Check if element is visible in viewport

Usage no npm install needed!

<script type="module">
  import opuuInview from 'https://cdn.skypack.dev/@opuu/inview';
</script>

README

InView: Is it in viewport?

InView.js check if an element is visible in the viewport.

Getting Started

Using InView is easy.

Install

Install it from npm.

npm install @opuu/inview

Import

Import it in your project.

import InView from "@opuu/inview";

or

<script type="module">
    import InView from "./path/to/inview.js";
</script>

Usage

// select elements to track
let elements = new InView(".selector");

// add enter event listener
elements.on("enter", (event) => {
    console.log(event);
    // do something on enter
});

// add exit event listener
elements.on("exit", (event) => {
    console.log(event);
    // do something on exit
});