Stagger is not working

[momo12 16 Likes (Newbie)]

Hi guys,

 

I have a problem. The stagger of mouseout works but the mouseover stagger is not working!

 

See the Pen bGMrYgp by talewoy290 (@talewoy290) on CodePen

[Rodrigo 5,885 Likes (Superhero)]

Hi,

 

It is actually working, we just can't see it  The issue is that it starts from the first image that is at the bottom of the stack of images. But lucky for us GSAP has advanced staggers that help you with this:

el.addEventListener("mouseover", (e) => {
  gsap.to(".first", {
    scale: 0.5,
    duration: 0.6,
    stagger: {
      each: 0.1,
      from: "end"
    }
  });
});

See the Pen gOzxvGQ by GreenSock (@GreenSock) on CodePen

 

Happy Tweening!!!

[momo12 16 Likes (Newbie)]

9 minutes ago, Rodrigo said:

Hi,

 

It is actually working, we just can't see it  The issue is that it starts from the first image that is at the bottom of the stack of images. But lucky for us GSAP has advanced staggers that help you with this:

el.addEventListener("mouseover", (e) => {
  gsap.to(".first", {
    scale: 0.5,
    duration: 0.6,
    stagger: {
      each: 0.1,
      from: "end"
    }
  });
});

 

 

 

Happy Tweening!!!

Thanks man. You are a GSAP super hero.