CODEWITHSUNDEEP
javascriptjquerycssinternet-explorerrotation
cosmoonot
cosmoonot

Reputation: 2189

Jquery Rotate Image for IE 6 >

I was hoping someone could shed light on IE 6 > image rotation code. I have tried using (http://code.google.com/p/jquery-rotate/) with no success. I'm able to rotate the image based on this post (Stackoverflow post) for FF, Chrome and Safari.

Any help or direction to rotate an image at 45deg angle would be appreciated. Thanks.

Example: My test for rotation

Upvotes: 2

Views: 7557

Answers (4)

Spudley
Spudley

Reputation: 168755

This is an old question, but things have moved on since it was asked so in case people are still reading this, I'll chip in with an alternative solution that works well:

For all browsers in current use except IE8 and earlier, the simplest solution for rotating an element is the standard CSS syntax transform:rotate(45deg).

For IE6/7/8, the best option is the CSS Sandpaper javascript library.

CSS Sandpaper implements standard the CSS rotation syntax, along with several other CSS features. This means you can use standard CSS syntax in all browsers.

The good thing about this is that it means that although you're using javascript for IE, you don't need to involve any JS code for other browsers, which should be good for performance. It's also good to be using the web standards on browsers that support them.

Upvotes: 0

mattsven
mattsven

Reputation: 23293

Did you read... http://developercity.blogspot.com/2010/09/rotate-div-or-image-using-jquery-ie-and.html

EDIT: Try this: http://pastebin.com/gB4iATpm

Upvotes: 0

Hussein
Hussein

Reputation: 42818

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.

Upvotes: 12

terrygarcia
terrygarcia

Reputation: 477

In my opinion, CSS3 is the way to go, because (in this scenario), you can just do transform: rotate(xxdeg);. There are methods for ensuring backwards compatibility, such as this: http://fetchak.com/ie-css3/
Hope it helps!

Upvotes: 0

Related Questions