rvp Posted December 13, 2021 Share Posted December 13, 2021 Hey guys, I came across the following issue: the provided codepen contains a simple ScrollTrigger layout. I believe the gsap-generated `pin-spacer` div causes a horizontal scrollbar to appear on the page. So to hide that scrollbar I've tried adding `overflow-x: hidden` to the body element but for some reason that seems to also hide the vertical scrollbar and therefore disables page scrolling altogether. To reproduce, just enable the `// overflow-x: hidden;` line and observe how both scrollbars will be hidden. So am I doing something wrong here or is this a GSAP bug? My main goal is to remove the horizontal bar without breaking vertical scrolling and I can't seem to achieve it so far. Any input would be appreciated! See the Pen wvroROJ by RVP22 (@RVP22) on CodePen Link to comment Share on other sites More sharing options...
Solution OSUblake Posted December 14, 2021 Solution Share Posted December 14, 2021 Welcome to the forums @rvp I think you just need to set the width of your pages to 100% instead of 100vw. 100vw doesn't account for the width of the scrollbars. Link to comment Share on other sites More sharing options...
rvp Posted December 14, 2021 Author Share Posted December 14, 2021 Thanks for taking the time to look into this @OSUblake! That indeed was the solution! Much appreciated! Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now