in-view
A web component for checking if an element is in view using Intersection Observer
UNLICENSE License
Ecosystems:
Web Components
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
Resources
Properties
- 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)
Basic Usage
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>
Package Rankings
Top 31.91% on Npmjs.org