The script for the animated title block

the-animated-title-block-scripts.js

// https://cdn.jsdelivr.net/npm/[email protected]/dist/splitting.min.js
(() => {
  const animatedClass = 'is-animated';
  const observer = new IntersectionObserver((entries) => {
    entries.forEach((entry) => {
      animateElement(entry.target, entry.isIntersecting);      
    });
  }, {rootMargin: '0px'});
  
  const animateElement = (element, isToggle) => {
    element.classList.toggle(animatedClass, isToggle);
  }
  
  const headingElements = document.querySelectorAll('BLOCKSELECTOR .is-animated-heading');
  if (headingElements.length) {
    headingElements.forEach((animatedElement) => {
      Splitting({
        target: animatedElement,
      });

      observer.observe(animatedElement);
    });
  }
})();