translate vs transform-origin css3

Sas*_*sha 16 css transform css3

我想知道是否有人可以帮助我.我一直无法理解css3属性究竟是什么:transform-origin.我似乎无法按照它正在移动的方向.

例如,假设您有一个方形div,并将其旋转40度.然后你执行一个transform-origin: 100% 0%.你能做到translateX(and some value)吗?看起来translateX会在执行旋转后相对于新旋转的轴沿x轴移动它.我似乎无法跟随变换原点正在做什么,或者它究竟是什么.

一个清晰而彻底的例子将非常受欢迎.=)

jos*_*hnh 29

transform-origin更改元素变换的点而不是移动整个元素(如翻译所示).默认值为transform-origin: 50% 50%;.

这是一个例子:http://jsfiddle.net/joshnh/73g7t/

  • 这个链接现在似乎不起作用,但这样做:http://jsfiddle.net/73g7t/ (2认同)