GSAP parallax

Add the class .gomo-parallax toa a cover block

require get_theme_file_path('/components/gsap/gsap.php') ;
// and in gsap.js
function initGomoParallax() {
  gsap.utils.toArray(".gomo-parallax").forEach(function (coverParallax) {
    var imageParallax = document.getElementsByClassName(
      "wp-block-cover__image-background"
    );
    gsap
      .timeline({
        scrollTrigger: {
          trigger: coverParallax,
          scrub: true,
          start: "top bottom",
          end: "bottom top",
          // markers: true,
        },
      })
      .fromTo(
        imageParallax,
        {
          y: -100,
          scale: 1.5,
        },
        { y: 100, scale: 1.5, ease: "none" },
        0
      );
  });
}

Search the site


Address

123 Main Street
Town
City
P05T C0D3

Tel: 01234 567 899

Mob: 01234 567 899

Email: ben@gomopress.com


Copyright 2023. Blah blah blah Company Limited