// Create a function that will handle any intersection between some elements and the viewport.
const handleHeaderIntersection = function (entries) {
  entries.forEach(entry => {
    if (entry.isIntersecting) {
      msgConsole('IntersectionObserver','The header is visible in the viewport');
      if (typeof headerIsNowVisible === 'function') headerIsNowVisible(entry);
    } else {
      msgConsole('IntersectionObserver','The header is invisible in the viewport');
      if (typeof headerIsNowInvisible === 'function') headerIsNowInvisible(entry);
    }
  });
}

const section_header = document.querySelector("header");
if (section_header) {
  const headerObserver = new IntersectionObserver(handleHeaderIntersection);
  if (headerObserver) headerObserver.observe(section_header);
} else myLog('No header to observe');