JSFiddle - React, Tailwind, and code Playground

Intersection Observer test with tall body and viewport root.

by Travis Almand

CSS

html,
body {
  margin: 0;
  padding: 0;
}

body {
  height: 1000px;
}

JavaScript

console.clear();

let spacer = document.querySelector('#spacer');
let threshold = [...Array(100).keys()].map(x => x / 100);
let options = {
	root: null,
  rootMargin: '0px',
  threshold: threshold
}
let observer = new IntersectionObserver(callback, options);
observer.observe(document.body);

function callback (entries, observer) {
	//console.log(observer);
	entries.forEach(entry => {
  	console.log(entry);
  });
}