JAVASCRIPT

javascript how to check if element is visible on screen

var observer = new IntersectionObserver(function(entries) {
	if(entries[0].isIntersecting === true)
		console.log('Element is fully visible in screen');
}, { threshold: [1] });

observer.observe(document.querySelector("#main-container"));

javascript check if element is visible on screen

// Where el is the DOM element you'd like to test for visibility
<script>
  function isHidden(el) {
    return (el.offsetParent === null);
  }
  var el = document.getElementById('el');
  alert(isHidden(el));
</script>
// if true then element "el" is visible otherwise not visible