Jump to content
Search Community

Is it possible to have a stagger start in-progress?

ekfuhrmann test
Moderator Tag

Go to solution Solved by PointC,

Recommended Posts

  • Solution

Sure. You could just chain a .time() or .progress() to the end of the timeline. 

 

gsap.timeline().to("[data-animation='gsap'] .box", {
  duration: 2.5,
  yoyo: true,
  yoyoEase: true,
  y: -50,
  ease: "power1.inOut",
  stagger: {
    each: 0.5,
    from: "end",
    repeat: -1
  }
}).time(3.5);

Happy tweening.

:)

 

  • Like 4
Link to comment
Share on other sites

10 minutes ago, ekfuhrmann said:

Terrific, I imagine there is no real way to avoid the flicker that occurs before the page finishes loading for JS like that outside of hiding it until it's loaded?

 

Unfortunately, no due to JavaScript being run last. If it's noticeable, I usually set the opacity to 0 in the CSS and then do a quick fade in at the very start.

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