Using ScrollSmoother on a WordPress site

[Reinoud 4 Likes (Newbie)]

Hi Gsap'ers!

 

I bought the Shockingly Green about a week ago, because of the ScrollSmoother plugin. 

The sites scroll like a dream now, it's awesome!

 

The company I work for makes WordPress sites with the Divi theme and I had to make the ScrollSmoother work so we can apply it on all our new sites.

If I just add the ScrollSmoother.create({}), the smooth wrapper will wrap very strange in WordPress, so I tried several way's to wrap it correclty, with no real results yet.

 

Here's my problem:

 

The problem is best visibile in Safari. Safari always takes a while to load the page fully. When you load the page en start scrolling right away, you'll notice that when the page is finally done loading, the triggers replace and scrolling becomes very buggy for a few seconds. 

After that a brown (probably the background-color of the page) bar appears at the top, and when scrolling down the footer won't appear every time. 

 

You can get this problem in chrome as well, but you have to start scrolling before the page loads.

 

Does somebody know a wat to solve this?

 

I tried: 

normalizeScroll: true

ScrollTrigger.normalizeScroll()

 

I added a "console.log("right here!")" so you can look up my code easily.

 

Here's the link (it's a test site):

Power | Tobias REDDSTONE

 

[Cassie 5,165 Likes (Superhero)]

Hey there! Thanks for the kind words.

 

It's very hard for us to debug live sites I'm afraid. You may need to call ScrollTrigger.refresh() once the page has finished loading?