JSPM

view-in

0.0.4
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • 0
  • Score
    100M100P100Q18911F
  • License ISC

A dependency free utility to set and remove animation classes on elements as they become visible in the viewport, using the Intersection Observer API

Package Exports

  • view-in

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (view-in) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

ViewIn.js

ViewIn(tersector) is a simple utility to apply and remove classes to DOM elements as they enter the view port, using the Intersection Observer API.

Usage

viewIn('.my-selector', options);

Options

Option Type Default Description
classOnEnter string inview-enter Class added when element is visible
classOnExit string inview-exit Class added was visible but then exits viewport
exitThreshold number 0.75 % of element visible to trigger exit
enterThreshold number 0.75 % of element visible to trigger enter

To Do

  • Add Interes feature detection
  • Allow a callback to be passed for exit and enter
  • Make options ... optional
  • Error cases
  • once: boolean - only trigger the observerable once