Elyssa Posted April 24, 2022 Share Posted April 24, 2022 Hi all, I'm still a beginner on this. Can someone help me please? How do I translateY a rectangle and at the same time slightly rotate it? Something like this:https://tympanus.net/Development/MenuThumbStackAnimation/ See the Pen BaJeNKg by yssapalasi (@yssapalasi) on CodePen Link to comment Share on other sites More sharing options...
Cassie Posted April 24, 2022 Share Posted April 24, 2022 Hi there, welcome to the GSAP forums! As we state in the forum guidelines we don't have capacity to investigate, recreate or explain how to create custom effects found on other websites. The code for the example you posted is actually linked to on the demo page anyway - so there's not much more we can add! We are more than happy to answer GSAP-specific questions though. So if you give this effect a go yourself with GSAP and get stuck in the process, feel free to post a minimal demo here and we'll give you some advice on how to get closer to your goal. Link to comment Share on other sites More sharing options...
Elyssa Posted April 24, 2022 Author Share Posted April 24, 2022 Hey Cassie, Thanks, I've updated it with my codepen with quicksetter demo of the mouse follow. It is now rotating slightly however, I can't seem to make it work when I add a translateY. And also trying to add a random number to rotate. Link to comment Share on other sites More sharing options...
Solution Cassie Posted April 24, 2022 Solution Share Posted April 24, 2022 Not sure I understand what you mean by, 'add a random number to rotate' But you're on the right track. I'm not really sure what effect you're after but it's all about getting values from the mouse and mapping them into a useable range. See the Pen QWaRKmP?editors=0010 by GreenSock (@GreenSock) on CodePen Maybe this blog post will help?https://www.cassie.codes/posts/making-a-lil-me-part-1/ 3 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