Unable to scroll on fixed sidebar with ScrollSmoother

[growmybusiness]

Hi!

 

So I've got a blog-style layout but with a fixed sidebar that needs to able to have a vertical overflow on it. However as you can see by the codepen, you're unable to scroll the overflow due to the ScrollSmoother.

 

So Just wondering if anyone has any ideas about solving this?

 

Thanks,

Ben Elwood

See the Pen jOxBaxQ by benjaminelwoods (@benjaminelwoods) on CodePen

[Rodrigo]

Hi,

 

Two  things seem to solve this, at least in chrome and firefox on Ubuntu 20 and 22.

 

First add a z-index to your sidebar, since it sits under the rest of the content.

Second change normalizeScroll: true to normaliseScroll: true in your smooth scroller config and it seems to be working.

 

We're aware that the documentation and examples are using a Z instead of an S, so we'll try to unify things ASAP, in the mean time just keep the reminder at hand

 

Happy Tweening!!!

[GreenSock]

No no, the correct spelling is with a "z" NOT an "s". So "normalizeScroll". If you change it to normaliseScroll (incorrect), that's the same thing as just not enabling it because that property doesn't exist 

 

Your HTML structure was incorrect, you didn't have a wrapper element, and you should set allowNestedScroll: true: 

See the Pen BaxWJVe?editors=1010 by GreenSock (@GreenSock) on CodePen

 

Is that what you were looking for? 

[growmybusiness]

18 hours ago, GreenSock said:

No no, the correct spelling is with a "z" NOT an "s". So "normalizeScroll". If you change it to normaliseScroll (incorrect), that's the same thing as just not enabling it because that property doesn't exist 

 

Your HTML structure was incorrect, you didn't have a wrapper element, and you should set allowNestedScroll: true: 

 

 

 

Is that what you were looking for? 

It does seem to have fixed it on the codepen - however on my actual site when you scroll on the sidebar overflow, it scrolls the content section as well.

I know I'm supposed to recreate it in a codepen but I haven't been able to figure out what's causing this issue, so here's a link to the live site.

 

Hopefully you can help!

 

Thanks,

Ben Elwood

 

[GreenSock]

Sorry, we really can't troubleshoot a live site like that. There are way too many factors involved. I don't see the problem you're describing and I don't even see any smoothing being applied at all. 

 

My suggestion would be to isolate the issue in a CodePen. Start as simple as possible and then build it up to get closer and closer to your live site until it breaks and then you'll have a much better idea of what's causing the problem. You're welcome to post in the "Jobs & Freelance" forum or contact us for paid consulting services. 

 

Good luck, Ben! 👍

[growmybusiness]

18 hours ago, GreenSock said:

Sorry, we really can't troubleshoot a live site like that. There are way too many factors involved. I don't see the problem you're describing and I don't even see any smoothing being applied at all. 

 

My suggestion would be to isolate the issue in a CodePen. Start as simple as possible and then build it up to get closer and closer to your live site until it breaks and then you'll have a much better idea of what's causing the problem. You're welcome to post in the "Jobs & Freelance" forum or contact us for paid consulting services. 

 

Good luck, Ben! 👍

That's all good - thanks for your help!