Jump to content

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

why does not run rotateX and rotateY

Recommended Posts

Hi everybody, is just a try to undertsand the sintax but after trying and trying it does not work. When I try to change the rotation to an specific axis it does not work.

thanks. My intention is that it runs after this first rotation.

See the Pen vYZgYyb by alexeiv (@alexeiv) on CodePen

Link to comment
Share on other sites

Hi @alexeiv


We'd be happy to help, but the demo you posted is coming up 404. Could you please check the link? Thanks.

Link to comment
Share on other sites

Looks like it's working now. Thanks.


Unfortunately 3D transforms are not supported by SVG elements. You can apply the transforms to the entire SVG as a workaround.


Happy tweening.



PS  Just FYI - the new syntax would be.


gsap.to("#G", {
  duration: 1,
  rotation: 90,
  transformOrigin: "101.5px 55px -120px",
  ease: "none"


  • Like 3
Link to comment
Share on other sites

so,...which the use for rotateX and rotateY, this are not Z axis, this are just x and y.I try it to make with just a polygon but it dont works.


Link to comment
Share on other sites

Correct. It won't work with any child elements of the SVG, but you can rotate the whole SVG in 3D space. Or you can put the SVG in a div and rotate the div.


Happy tweening.



  • Like 2
Link to comment
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.