Jump to content
GreenSock

samuelhigginson

GSAP Random function gets called twice?

Go to solution Solved by OSUblake,

Recommended Posts

hello! 👋

 

I'm trying to avoid the elements jumping to their 'new' random location (not the FOUC) on Scroll Start.

I think it's something to do with the random function getting called on load, and then again when the playhead reaches the function in the timeline?

Maybe something to do with the .from as well?

 

Whatever it is, I gave it a good go and I'm stumped.

If anyone can give us a hand, that'd be awesome.

See the Pen JjMBBRa by halfvillain (@halfvillain) on CodePen

Link to comment
Share on other sites

  • Solution

Hi Samuel, 

 

I'd just use the regular random functions instead so the random value doesn't get recalculated.

 

.from('#div0', {
        duration: 1,
        xPercent: gsap.utils.random(-400, 400),
        yPercent: gsap.utils.random(-400, 400),
        rotation: gsap.utils.random(-25, 25)
    })

 

Link to comment
Share on other sites

33 minutes ago, OSUblake said:

Hi Samuel, 

 

I'd just use the regular random functions instead so the random value doesn't get recalculated.

 

.from('#div0', {
        duration: 1,
        xPercent: gsap.utils.random(-400, 400),
        yPercent: gsap.utils.random(-400, 400),
        rotation: gsap.utils.random(-25, 25)
    })

 

 

Cheers Blake!

🤝

 

A perfect solution for my initial query.

However I've just been experimenting, and it doesn't seem to work so well for staggered animations..

 

See the Pen GRyBXvm by halfvillain (@halfvillain) on CodePen

 

It seems the utility function doesn't give each target their own individual value, and I'm unsure on how correct this.

 

Any ideas? 🤔

 

 

Link to comment
Share on other sites

Oh, I wouldn't use it for the defaults as it will be the same for every element. You need to target every element kind of like this.

 

 

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

 

  • Like 3
Link to comment
Share on other sites

Ahhhhhh of course, mega!

Cheers fella.

  • 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.
×