Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
Abi Rana

GSAP rotateY or rotationY issue when applying inner SVG elements

Recommended Posts

Hello guys, I was working on some animation for my client and I found the issue with rotateY which I'm unable to implement. Can you guys please check and let me know if there is any solution to this?

 

I've checked few forum topics and did see the solution below shared by you guys. It suggests to use scaleX but element is not a symmetrical element so I need it actually be flipped and I don't think I can use it as a separate SVG as well.

 

 

By the way storyline is as follow (store guy filling crate to a van):

  • store guy goes near the van
  • crate is left there (hide crate)
  • store guy come back to the crate laying outside the store
  • picks another crate
  • repeat until there is no crate

 

So can you guys please check and let me know if there is any solution to this?

 

Thank you for checking in.

Abi Rana

See the Pen JjYmeaw by abirana (@abirana) on CodePen

Link to post
Share on other sites

The solutions mentioned in the other thread are your best options. I don't understand why those wouldn't work for your store guy. You can animate the scaleX of that group and it's happening quickly (0.1) so it should look fine.

 

Happy tweening.

  • Like 3
Link to post
Share on other sites

Really sorry for the late reply.

 

And scaleX did work for me. At first I thought it wouldn't work because I had to flip the guy; so I thought that would not work. But then again I tried using -1 value and just worked like a charm.

 

Thank you so much for the reply.

 

Regards,

Abi Rana

 

 

Link to post
Share on other sites

By the way, they are using symmetrical element on their solutions mentioned in the other thread. So they might not have faced this issue.

 

So for asymmetrical element using -1 for scaleX value does the trick. So if someone needs flipping or spinning on Y axis they should definitely use this in place on rotateY or rotationY.

Link to post
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    No registered users viewing this page.

×