¿Establecer el punto de rotación en CSS3?


¿Es posible establecer el punto de rotación en CSS3? El punto de rotación predeterminado está en el 50%, 50%. Lo intenté:

-webkit-transform: rotate(230deg); -webkit-rotation-point:90% 90%;

Pero no funciona... Alguna sugerencia?

Author: kugyousha, 2011-07-11

3 answers

Esto establecerá el punto de pivote de rotación en la esquina superior izquierda de su elemento y lo girará:

-webkit-transform: rotate(-25deg);
-webkit-transform-origin: 0% 0%;

Echa un vistazo a .nav_item_txt class

Http://jsfiddle.net/KHkX7 /

 36
Author: Marconi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2012-11-22 11:17:54

Intente usar la propiedad transform-origin en su lugar, rotation-point no es compatible...

Para girar en el punto superior derecho de un elemento (incluyendo todos los objetivos):

-webkit-transform-origin: 100% 0;
-moz-transform-origin: 100% 0;
-ms-transform-origin: 100% 0;
-o-transform-origin: 100% 0;
transform-origin: 100% 0;
 8
Author: Phill upNorth,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-11-27 12:47:01

Simplemente vaya a http://www.w3schools.com/cssref/css3_pr_rotation-point.asp y lea cuidadosamente. dice que ninguno de los principales navegadores soportan esta propiedad.

 -2
Author: Mayur,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2013-03-27 17:31:40