Jump to content
Search Community

Gsap scrollTrigger check if/else

digitalfrci test
Moderator Tag

Recommended Posts

hello here it the code.

 

i may use it for several block, but some time it wont have .staggerInFirst , so there is way to put an if / else to check it this box have staggerInFirst then execute the tl ?

gsap.utils.toArray('.staggerIn').forEach((staggerIni) => {
    let tlstaggerIn = gsap.timeline({
        scrollTrigger: {
        trigger: staggerIn,
        start: "top 70%",
        }
    });
 
tlstaggerIn.from(staggerIn.querySelectorAll('.staggerInFirst'), {opacity:0 , duration: 0.5, y:-10})
           .from(staggerIn.querySelectorAll('.staggerInStagger'), {opacity:0 , duration: 0.5, y: 10,  stagger: .25,},)
 
           
        
});
 
Link to comment
Share on other sites

If I understood correctly:

gsap.utils.toArray('.staggerIn').forEach((staggerIn, i) => {
  let tlstaggerIn = gsap.timeline({
      scrollTrigger: {
        trigger: staggerIn,
        start: "top 70%",
      }
    }),
    first = staggerIn.querySelectorAll('.staggerInFirst');
  if (first.length !== 0) {
    tlstaggerIn.from(first, {opacity:0 , duration: 0.5, y:-10});
  }
  tlstaggerIn.from(staggerIn.querySelectorAll('.staggerInStagger'), {opacity:0 , duration: 0.5, y: 10,  stagger: .25});    
});

Happy tweening!

  • Like 1
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...