Jump to content
Search Community

Interesting flicker behavior

tganyan test
Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

So I'm still pretty new to GSAP and just playing with simple shapes and movement to get a full grasp of things. I have a timeline that triggers a secondary timeline that repeats until user clicks somewhere on the body. All of that works just fine, but I'm noticing that when the secondary timeline starts (tells the div to just move to a random location over and over), a lot of the time it flickers badly before its next movement. This doesn't happen every time but happens most of the time (same in both Chrome and Firefox). I've tried animating both left and bottom properties, and then changing it to x and y to see if it made a difference (based on the advice I saw in another post), and neither seemed to have any impact on the issue. 

 

Some clarity on what I'm doing wrong here would be awesome!

See the Pen wORrZr by tganyan (@tganyan) on CodePen

Link to comment
Share on other sites

Thanks! As stated in my original comment, I tried x and y but still had the same issue. It looks like clearing it has fixed the flicker. Just curious though, is there another reason why x and y would be preferable to absolute position values in this case?

Link to comment
Share on other sites

The conventional wisdom is to use x/y which are equivalents of translateX and translateY. They'll be more performant than left/top. It'll be most noticeable on longer duration animations. You're using some quick moves so you may not even notice a difference in this case. If it works correctly and looks good to you while using left/top, go for it. 

 

Happy tweening.

 

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