Rework virtual Scrolling about damselfly HOT 1 CLOSED

// this is the target which is observed
var target = document.querySelector('div')

// configure the intersection observer instance
var intersectionObserverOptions = {
  root: null,   // default is the viewport
  threshold: .5 // percentage of the taregt visible area which will trigger "onIntersection"
}
    
var observer = new IntersectionObserver(onIntersection, intersectionObserverOptions)

// called when target is fully visible
function onIntersection(entries, opts){
  entries.forEach(entry => {
    var visible = entry.intersectionRatio >= opts.thresholds[0]
    
    console.clear();
    console.log(entry.intersectionRatio.toFixed(2), visible)
    
    target.classList.toggle('visible', visible)
  })
}

// provide the observer with a target
observer.observe(target)

// To stop watching, do:
// observer.unobserve(entry.target)