Jump to content
Search Community

ScrollTrigger .batch and child animations

acantoroBB test
Moderator Tag

Go to solution Solved by Stefano Monteiro,

Recommended Posts

Hello,

 

I have a question about Batch method in ScrollTrigger. I read the doc but I couldn't find where to animate child of current triggered element.

In my example I'd like to animate "name" and "gender" div of my batched div ".item".

Is there any method to make this ? I thought use gsap.utils.toArray, is it a good way ?

 

Thank you.

 

ScrollTrigger.batch(".item", {
  interval: .5,
  batchMax: 4,
  start: "top 75%",

  onEnter: batch => {

    //Instead of batch I'd like to animate children of triggered .item
    gsap.to(batch, {
      opacity: 1,
      scale: 1,
      duration: 1,
      ease: "power4.out",
      stagger: 0.25,
    });
  },
});

 

See the Pen NWdmxRr by bappla (@bappla) on CodePen

Link to comment
Share on other sites

  • 8 months later...

Hi OSUblake,

Thank you for your response. I thought so, but I didn't figure out how to do it. Can I have a timeline inside a batch? I don't think so. 

Do you know where I can find an example of this or would you be so kind and give me a little hint? :-)

Best, Urs

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...