IntersectionObserver setup 2

intersection-observer-setup-2.js

    intersectionObserver = new IntersectionObserver(function(entries) {
      const entry = entries[0]; // observe one element
      const currentRatio = intersectionRatio;
      const newRatio = entry.intersectionRatio;
      const boundingClientRect = entry.boundingClientRect;
      const scrollingDown = currentRatio !== undefined && newRatio < currentRatio &&
        boundingClientRect.bottom < boundingClientRect.height;
 
      intersectionRatio = newRatio;
 
      if (scrollingDown) {
        // it's scrolling down and observed image started to hide.
        // so unobserve it and start loading next images.
        const i = indexToObserve + INTERSECT_PAGESIZE;
        unobserve();
        indexToObserve = i; // set next index and load two more images
        console.info(currentRatio + ' -> ' + newRatio + ' [' + i + ']');
      }
 
    }, { threshold: [0, 0.25, 0.5, 0.75, 1] });