Jump to content
Search Community

SmoothScroll cuts off end of page on resize

wobwobwob test
Moderator Tag

Recommended Posts

Hi,

I am using a official GreenSock script found on Codepen (link), to implement SmoothScroll with the native ScrollTrigger .

 

Everything works perfect, but when I for example go from Portrait to Landscape the ending of the screen is not visible anymore. I discovered the height of the body is changed correctly, but the transform that pushes the content up is lower. Below an example:

1. When I load the page in Horizontal mode, the Y at the end of the page is: 1486
2. When I load the page in Portrait mode and than switch to Landscape, the Y at the end of the page is: 1189.

My first guess was this was caused by content that does not instantly takes shape due to transitions and such, but this is not the case. Even on a normal text page, the problem exists.

I analysed the script and it looks like it's resizing as it should, could you help me pinpoint to what could be the problem?

Kind regards,

 

Tom

 

Screenshot 2021-10-21 at 14.56.59.png

See the Pen gOgWELo by GreenSock (@GreenSock) on CodePen

Link to comment
Share on other sites

Hi,

 

True, the demo works perfect!

I found out more about the problem. The code does not seem to work well with some other GSAP animations. I am pinning a section that is 100vh and if I resize from portrait to landscape, the height of the body is one screen height shorter. I guess during resize GSAP does not detect the section having any height. When I disable this section, everything works fine.

I tried to replicate the issue in a Codepen. I managed to write a code where the page breaks, when switching landscape mode (

See the Pen vYJyjzz by tomraas (@tomraas) on CodePen

). Instead of making the page too short, the codepen somehow makes it longer...

Do you know a solution to fix this?

Kind regards,

Tom Raas

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