in-view

A web component for checking if an element is in view using Intersection Observer by wrapping a HTML template tag.

Install

npm install --save @zicklepop/in-view

data-rootMargin string, optional: CSS margin syntax to expand the outside area considered in view. (mdn)
data-threshold float, optional: Sensitivity for how much of the element must be in view, written as a decimal representation of a percentage. (mdn)

To work it only requires a template element around whatever you want to render when in view.

<in-view>
  <template>I show up when I'm in view!</template>
</in-view>

Name		Name	Last commit message	Last commit date
Latest commit History 4 Commits
.DS_Store		.DS_Store
.editorconfig		.editorconfig
LICENSE		LICENSE
README.md		README.md
demo.html		demo.html
in-view.d.ts		in-view.d.ts
in-view.js		in-view.js
package.json		package.json