JPM82 Posted March 4, 2022 Share Posted March 4, 2022 Every so often my animations will not load all the way. What usually happens is that the width of the page will only load to about 60-80%. Does anyone know what could cause this? I'm wondering if it has something to do with the loading (???). Still pretty to new to GSAP so it's likely I'm not using something correctly. See the Pen VwrgvLJ by Gemini7401 (@Gemini7401) on CodePen Link to comment Share on other sites More sharing options...
OSUblake Posted March 4, 2022 Share Posted March 4, 2022 Hi JPM82, You need to be a little more specific that. Can you provide a minimal demo that shows the issue? Thanks! Link to comment Share on other sites More sharing options...
JPM82 Posted March 4, 2022 Author Share Posted March 4, 2022 @OSUblake Yes I certainly can! I just thought I'd check first to see if this is a common thing. I'll post a minimal demo as soon as I can. Link to comment Share on other sites More sharing options...
OSUblake Posted March 4, 2022 Share Posted March 4, 2022 The most common known issue is when using .from() animations with ScrollTrigger, which will be fixed in the next release. Link to comment Share on other sites More sharing options...
JPM82 Posted March 4, 2022 Author Share Posted March 4, 2022 @OSUblake Ok, I just added a crude demo but it does the trick. The red and blue sections beneath are just for context. I haven't been able to reproduce the bug in the pen however. Also, I wanted to get the offset image to scroll with a little with page. I'm using vanilla js for this now, but wondering if gsap can help with this? Like pin it for 100px or something??? Link to comment Share on other sites More sharing options...
OSUblake Posted March 4, 2022 Share Posted March 4, 2022 I don't see anything in your code that would cause any issues with the animation. Are you saying it's the clipPath doesn't animate all the way? I'm wondering if you are using Safari by chance? 15 minutes ago, JPM82 said: I'm using vanilla js for this now, but wondering if gsap can help with this? Like pin it for 100px or something??? Sure, you can use ScrollTrigger for stuff like that. Link to comment Share on other sites More sharing options...
JPM82 Posted March 4, 2022 Author Share Posted March 4, 2022 @OSUblakeI'm using Chrome. I'm fairly certain the clipPath is animating all the way. I think it may be something more than the gsap library here. Im logging my window Y & X offsets when I refresh the page and they're all over the place, which is why I think it appears the animations aren't' completing even when they are. Link to comment Share on other sites More sharing options...
OSUblake Posted March 4, 2022 Share Posted March 4, 2022 13 minutes ago, JPM82 said: I think it may be something more than the gsap library here. That's usually the case if you can't reproduce the same issue on CodePen. The only other I can think of to check is to make sure you don't have CSS transitions on properties you are animating with GSAP. 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