Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Instead of relying on page view events, you may wish to know if the visitor has actually consumed the page content. We’re Browsers are not quite there yetyet smart enough to know when the visitor has read the content, but an interim step might be to record an event when the visitor at least scrolls to the bottom of the page or other element.

...

Code Block
languagejs
isScrolledToBottom = false;
window.addEventListener('scroll', (event) => {
  // The scroll event occurs a lot, but we only want this once per page load.
  if (isScrolledToBottom) return;
  
  // Get the bounding client rectangle of our content <div>.
  const rect = document.getElementById('large_content').getBoundingClientRect();
  
  // Check to see if the bottom of it is visible within the viewport.
  if (rect.top >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight)) {
    // Record a custom event.
    S4SCloudsend2crm.analytics?.setCustomEvent('PAGE_SCROLLED', { href: location.href });
    isScrolledToBottom = true;
  }
});