Làm thế nào để lấy giá trị kiểu biến đổi phần tử giả với Javascript?

Question

trạng:

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

Câu hỏi:
tôi cần phải lấy hợp thì tôi có thể hiển thị và thay đổi nó. Cần trợ giúp về đường dẫn dẫn tôi đến 360.
Bất kỳ ý tưởng nào?

Answer 1

Tôi tin rằng document.getElementById('XYZ').style.WebkitTransform sẽ trả lại "rotate(360deg)" trong trình duyệt WebKit. Bạn có thể sử dụng style.MozTransform cho Firefox 3.1+, style.msTransform cho IE9 +, style.OTransform cho Opera.

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

Để ràng buộc yếu tố với các sự kiện chuột:

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)'; 
} 

Nó có thể là đơn giản với jQuery, nhưng bạn phải biết rễ JavaScript của bạn!

Answer 2

Bạn đang gonna cần jQuery nhưng nó có thể là những gì bạn đang tìm kiếm ....

$(document).ready(function(){ 

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


}); 

này trả về giá trị như là một chuỗi. Bạn có thể nên kiểm tra xem nó trả về 360deg hoặc toàn bộ điều. Thả div cho cả jQuery và CSS. Đối với jQuery là nhanh hơn không gọi nó và trong CSS nó không thêm tính đặc hiệu.