Tuesday, 19 June 2012
Cross Browser Rotation Even IE 6
For IE add the following. All you have to do is replace the angle variable to your desired angle.
var element = document.getElementById("box");
var angle = 20;
radians = parseInt( angle ) * Math.PI * 2 / 360;
calSin = Math.sin(radians);
calCos = Math.cos(radians);
element.style.filter = 'progid:DXImageTransform.Microsoft.Matrix(M11=' + calCos + ', M12=-' + calSin + ',M21=' + calSin + ', M22=' + calCos + ', sizingMethod="auto expand")';
For the rest of the browsers here is the code:
var angle = 20;
element.style["rotation"] = angle + " deg";
// CSS3
element.style.MozTransform = "rotate(" + angle + "deg)";
// Moz
element.style.OTransform = "rotate(" + angle + "deg)";
// Opera
element.style.WebkitTransform = "rotate(" + angle + "deg)";
// Webkit/Safari/Chrome
Labels:
Javascript
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment