¿Cómo recuperar el valor de estilo de transformación de pseudo-elemento con Javascript?

Question

Situación:

div.xy:hover { 
    transform: all rotate(360deg); 
    -moz-transform: rotate(360deg); 
    -webkit-transform: rotate(360deg); 
    -o-transform: rotate(360deg); 
} 

Pregunta:
necesito para recuperar el con ella puedo mostrar y cambiarlo. Necesito ayuda con el camino que me lleva al 360.
¿Alguna idea?

Answer 1

Creo que document.getElementById('XYZ').style.WebkitTransform devolverá "rotate(360deg)" en los navegadores WebKit. Puede usar style.MozTransform para Firefox 3.1+, style.msTransform para IE9 +, style.OTransform para Opera.

Fuente: http://www.zachstronaut.com/posts/2009/02/17/animate-css-transforms-firefox-webkit.html

Para aprisionar elemento con eventos de ratón:

var e = document.getElementById('test') // Your div ID 

e.onmouseover = function(){ 
    var degree = 360; // Rotation on :hover 
    e.style.WebkitTransform = 'rotate(' + degree + 'deg)'; 
    e.style.MozTransform = 'rotate(' + degree + 'deg)'; 
    e.style.OTransform = 'rotate(' + degree + 'deg)'; 
    e.style.msTransform = 'rotate(' + degree + 'deg)'; 
    e.style.transform = 'rotate(' + degree + 'deg)'; 
} 
e.onmouseout = function(){ 
    var degree = 0; // Initial rotation 
    e.style.WebkitTransform = 'rotate(' + degree + 'deg)'; 
    e.style.MozTransform = 'rotate(' + degree + 'deg)'; 
    e.style.OTransform = 'rotate(' + degree + 'deg)'; 
    e.style.msTransform = 'rotate(' + degree + 'deg)'; 
    e.style.transform = 'rotate(' + degree + 'deg)'; 
} 

Puede ser que sea más sencillo con jQuery, pero tienes que saber sus raíces JavaScript!

Answer 2

Vas a necesitar jQuery pero podría ser lo que buscas ....

$(document).ready(function(){ 

$(".xy:hover").css("transform") 


}); 

este retorno el valor como una cadena. Probablemente deberías comprobar si devuelve 360deg o todo. Coloque el div tanto para jQuery como para CSS. Para jQuery es más rápido no llamarlo y en CSS no agrega especificidad.