Dennyno Posted December 9, 2021 Share Posted December 9, 2021 Hi all, Using clippy (https://bennettfeely.com/clippy/) I was trying to clip an element (trapezoid, or any polygon, just to understand) and remove the clip (or change it's value in my case) by scrolling. My demo seems not working, even changing values, which could be the problem? It's the right way? Or does gsap have any skew native function? Tx :) See the Pen KKXMGOd by DedaloD (@DedaloD) on CodePen Link to comment Share on other sites More sharing options...
Cassie Posted December 9, 2021 Share Posted December 9, 2021 Heya! I don't think your clip path was visibly changing much - You were also using all the skews as the trigger instead of the individual one. I made some little adjustments. Hope it helps! See the Pen wvrWQqa?editors=0011 by GreenSock (@GreenSock) on CodePen Link to comment Share on other sites More sharing options...
Dennyno Posted December 9, 2021 Author Share Posted December 9, 2021 23 minutes ago, Cassie said: Heya! I don't think your clip path was visibly changing much - You were also using all the skews as the trigger instead of the individual one. I made some little adjustments. Hope it helps! Thanks, the result shoul be somethin like this See the Pen mdBEade by DedaloD (@DedaloD) on CodePen from skewed to "none". It's me or your demo adds a triangle clip to the top-right side? Link to comment Share on other sites More sharing options...
Solution Cassie Posted December 9, 2021 Solution Share Posted December 9, 2021 Yep. I deliberately changed the clip path values to get something that was visibly changing. It was just to demonstrate that the issue was with the values you were plugging in - feel free to change those values to any other clip you want. It's not a finished solution, just a working one! 2 Link to comment Share on other sites More sharing options...
Dennyno Posted December 9, 2021 Author Share Posted December 9, 2021 7 minutes ago, Cassie said: Yep. I deliberately changed the clip path values to get something that was visibly changing. It was just to demonstrate that the issue was with the values you were plugging in - feel free to change those values to any other clip you want. It's not a finished solution, just a working one! Ohh now I see So the clip values where there problem... well then, thanks for the hint Link to comment Share on other sites More sharing options...
Cassie Posted December 9, 2021 Share Posted December 9, 2021 Sorry for not explaining that clearly enough! Good luck with your clipping! 1 Link to comment Share on other sites More sharing options...
Dennyno Posted December 9, 2021 Author Share Posted December 9, 2021 @Cassie How to reset the path? From skew to not-skew? It I set clip-path:none the animation jumps, instead of being smooth? See the Pen mdBEade by DedaloD (@DedaloD) on CodePen setting random values works. But "removing" the clip it doesnt. (Desired Result:Like on these images) Link to comment Share on other sites More sharing options...
Dennyno Posted December 9, 2021 Author Share Posted December 9, 2021 @Cassie Thanks a lot for your help 1 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