Skip to content
This repository was archived by the owner on Jun 27, 2019. It is now read-only.

jeremenichelli/intersection-observer-polyfill

Repository files navigation

Intersection Observer Polyfill

IMPORTANT: I'm not going to work on this polyfill since the WICG repository contains another one closest and more up-to-date according to the officla spec. I recommend using that one: https://github.com/w3c/IntersectionObserver/tree/master/polyfill

The IntersectionObserver API allows the developer to detect the intersection between a DOM elements and a reference element or the viewport.

BEWARE! This is still under development and doesn't cover all possible uses. Feel free to contribute!

You can see it working in this sample page built by Wilson Page.

For more insight read the official WICG draft.

Contributing

Read the draft, fork this repo and help... there's a lot of stuff to do here yet:

  • Support rootMargin in options
  • Add support for intersection ratio under threshold option
  • Add proper this context inside callback exposing root and rootMargin observer
  • Support root element different from viewport
  • Support unobserve method
  • Support disconnect method
  • Support takeRecords method
  • Complete properties present in callback's context argument
    • boundingClientRect
    • intersectionRect
    • rootBounds
    • target
    • time
  • Support horizontal scrolling detection
  • Improve frame rate performance on scroll
  • Create sample page for root different for viewport case

Browser support

This polyfill was tested in:

  • Chrome 49
  • Chrome Mobile 49
  • Firefox 45
  • Safari 9
  • iOS Safari 9
  • Microsoft Edge

About

Polyfill for native IntersectionObserver API

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 3

  •  
  •  
  •