Skip to content

A utility around intersection observer that adds and removes classnames from elements as they enter and leave the viewport

Notifications You must be signed in to change notification settings

wemakewaves/viewIn

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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

About

A utility around intersection observer that adds and removes classnames from elements as they enter and leave the viewport

Resources

Stars

Watchers

Forks

Packages

No packages published