Rotate DIV using jQuery with specific degree? [duplicate]

This question already has answers here:开发者_如何学JAVA Closed 11 years ago.

Possible Duplicate:

Rotating a Div Element in jQuery

How would I rotate a DIV and all the elements inside to a certain degree using jQuery? Like instead of just 90, 180, etc.. I would be able to set it at say 88.

---

Here is the code for the modern browsers with CSS (applied through jquery for your case)

$('#divID').css({
     '-moz-transform':'rotate(88deg)',
     '-webkit-transform':'rotate(88deg)',
     '-o-transform':'rotate(88deg)',
     '-ms-transform':'rotate(88deg)',
     'transform':'rotate(88deg)'
});

Have a look at the transform ^docs property

---

I think your best shot at this is to use CSS and then use jquery to switch out the css class that is being applied to the object like you can see here : http://answers.oreilly.com/topic/1004-how-to-rotate-an-image-with-css/

Good luck,

CEC

---

In HTML, you can't - text orientations different than horisontal and vertical are not supported. If you embed SVG, you can get text rotation there. It has nothing to do with jQuery limitations, it's just how HTML works.

EDIT: Huh. Cool. TIL.

Okay then, just do what they do: set CSS to:

transform: rotate(88deg);
-webkit-transform: rotate(88deg);
-moz-transform: rotate(88deg);

You can do it with

$(element).css({ "transform": "rotate(88deg)", "-webkit-transform": "rotate(88deg)", "-moz-transform": "rotate(88deg)" });

or do it more prettily by stuffing that into a class and invoking $(element).addClass("myObliqueClass").

---

Use the excellent jQuery Rotate plugin. http://code.google.com/p/jqueryrotate/. It is supported by all major browsers

* Internet Explorer 6.0 >
* Firefox 2.0 >
* Safari 3 >
* Opera 9 >
* Google Chrome 

To rotate an image, All you need to do is $('#myImage').rotate(30) //for a 30 degree rotation Where #myImage is the id of the element you want rotated.