Forum Discussion
Rotate object trigger
- 10 months ago
The code in GSAP will be as simple as possible. You need to find the desired object (the one you want to rotate), and it's best to do this by the object's ID.
Then, you create the animation. For example, a rotation of 90 degrees will look like this:
gsap.to(yourObject, { rotation: 90, duration: 1 });
A more interesting animation, where the object slightly tilts in the opposite direction and then rotates 90 degrees, will look like this:
gsap.to(yourObject, { rotation: -30, duration: 0.5, ease: "power2.out" }) gsap.to(yourObject, { rotation: 120, duration: 0.5, ease: "power2.out", delay: 0.5 });
I like the convert to dial option - I'd never noticed that before! But my problem is that my object is actually a group of objects. And when I rotate it using the dial, it doesn't rotate around the ceter of the group. Any thoughts on how to fix this?
becomes this!
I suspect the center position of each piece is correctly defined. Perhaps group the pieces, then rotate that as a whole.
Related Content
- 2 months ago
- 6 months ago
- 3 months ago