Jump to content
Search Community

ScrollSmoother parallax not working

Wizard of Oz
Moderator Tag

Go to solution Solved by OSUblake,

Recommended Posts

Posted

Looks like it's working to me. And no - you have to do a check yourself.

 

const animationIsOk = window.matchMedia(
  '(prefers-reduced-motion: no-preference)'
).matches;

if (animationIsOk) {
  // do all the animation.
}

 

  • Like 2
  • Thanks 1
Posted

hmmm... I looked at this earlier today and it was fine, but now I'm seeing the same thing as @Wizard of Oz. Seems like none of the effects are working.

Posted

I forked the pen and checked debug mode - same thing - no effects.

 

Pulled the whole project down locally - works perfectly with my downloaded Club version of ScrollSmoother 3.10.4.

 

Using the ScrollSmoother file from CodePen (also 3.10.4) - no effects in local testing. Weird. ?‍♂️

Wizard of Oz
Posted

Yep! Works with ScrollTrigger 3.10.4. Thanks guys :)

  • 2 weeks later...
Wizard of Oz
Posted

Both my pen and @OSUblake's pen lack the parallax effect again. Very odd as it seems to work on & off..

GreenSock
Posted

I can't reproduce the issue. @Wizard of Oz are you absolutely positive that you're using the latest version of all the GSAP files (3.10.4)? Any other secrets to getting the problem to show up? 

GreenSock
Posted

Yeah, my guess is that you've got a cached version of one or more of the files. Please do a hard-refresh or clear your cache to make absolutely sure you're getting the latest files. Or change the cache-busting URL parameter. 

GreenSock
Posted

I notice a few problems: 

  1. You've got NESTED effects. That won't work. In other words, you have a data-speed inside another element with a data-speed. 
  2. You didn't define a wrapper or content which is fine if you use an id of smooth-wrapper and smooth-content (defaults), but you used a CLASS instead. 
  3. You don't have a height or width applied to your images, so until the image is fully loaded, those measurements will be off. It should still work eventually because ScrollTrigger forces a refresh on the window's "load" event but I'm just mentioning this because it's typically a good idea to define a width/height on image elements if possible. 
  • Like 2
Wizard of Oz
Posted

Ahhh! There you have it. Thanks Jack :)

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