wobwobwob Posted October 21, 2021 Share Posted October 21, 2021 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 See the Pen gOgWELo by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
OSUblake Posted October 21, 2021 Share Posted October 21, 2021 Welcome to the forums @wobwobwob I'm not noticing that problem in the demo you posted. How can I reproduce the issue? 1 Link to comment Share on other sites More sharing options...
wobwobwob Posted October 22, 2021 Author Share Posted October 22, 2021 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 More sharing options...
OSUblake Posted October 22, 2021 Share Posted October 22, 2021 Thanks for the demo! We'll look into this. Link to comment Share on other sites More sharing options...
OSUblake Posted October 22, 2021 Share Posted October 22, 2021 Hey @wobwobwob Would you mind checking this out? The demo in the docs has also been updated with these changes. See the Pen mdMOgEx by GreenSock (@GreenSock) on CodePen 1 Link to comment Share on other sites More sharing options...
wobwobwob Posted October 25, 2021 Author Share Posted October 25, 2021 Hi, Looks like that works, thanks a lot for helping out! Kind regards, Tom 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