Jump to content
Search Community

Leelala

Members
  • Posts

    4
  • Joined

  • Last visited

Posts posted by Leelala

  1. If I'm understanding correctly, you can rotate around the left side by using transformOrigin: "left 50%". To rotate around the center, use "50% 50%". e.g.

    TweenLite.to(element, 2, {rotation:90, transformOrigin:"left 50%"});
    
    This is from the API for CSSPlugin:
    • transformOrigin - Sets the origin around which all transforms (2D and/or 3D) occur. By default, it is in the center of the element ("50% 50%"). You can define the values using the keywords "top", "left", "right", or "bottom" or you can use percentages (bottom right corner would be "100% 100%") or pixels. If, for example, you want an object to spin around its top left corner you can do this:

      //spins around the element's top left corner
      TweenLite.to(element, 2, {rotation:360, transformOrigin:"left top"});
      The first value in the quotes corresponds to the x-axis and the second corresponds to the y-axis, so to make the object transform around exactly 50px in from its left edge and 20px from its top edge, you could do:

      //spins/scales around a point offset from the top left by 50px, 20px
      TweenLite.to(element, 2, {rotation:270, scale:0.5, transformOrigin:"50px 20px"});

     

    Thank you so much jamiejefferson, this is exactly what i need! 

    :-)

×
×
  • Create New...