Jump to content
Search Community

Objects disappear and appear while scrolling. Using ScrollTrigger and LocomotiveScroll

PereCC test
Moderator Tag

Go to solution Solved by nico fonseca,

Recommended Posts

4 hours ago, nicofonseca said:

Hi @PereCC , the GSAP community is awesome, there are a lot of nice people here! 💚

About your issue, I don't know why but I don't see where it is 🙁 . Can you be more specific ? 


PS: I love the "locoScroll" variable name, in Spanish loco means "crazy" so i always read crazyScroll or "el scroll loco" 😂

Hi @nicofonseca 👋   "el scroll loco" 😂   sounds very cool!

 

This bug I can see in my Safari 13.1.3 (15609.4.1) I have created a little video from my screen you can see the video on youtube

Link to comment
Share on other sites

Very strange indeed - it looks like a new Safari bug related to when a transform switches from a 3D value like translate3d(0px, 0px, 0px) to a 2D one like translate(0px, 0px). By default, GSAP will use 3D transforms during the animation and then switch back to 2D for performance and memory reasons at the end. 

 

Try adding this:

gsap.config({force3D: true})

Or you can make it false. The default is "auto" which does the switching. 

  • Like 2
Link to comment
Share on other sites

  • Solution

As @GreenSock said if you set gsap.config({force3D:true }) and add on the headline:

 

gsap.set('.banner-big__headline',{
  y:0,
})

every works fine 🎉
 

One curious thing is that if don't add anything and remove the overflow:hidden to banner-big, everything works normal 🤷‍♂️

Welcome to the new Internet Explore 😂

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