CODEWITHSUNDEEP
javascriptcssrotationhtml2canvas
JanHocevar
JanHocevar

Reputation: 199

Is it possible to rotate HTML object without CSS3?

I'm building an app, where I create an canvas element of a specific div with the html2canvas javascript library. The problem is that it doesn't support CSS3 rotate property so if an image is rotated in the app html2canvas doesn't render it correctly (it doesnt apply rotate).

So, is it possible to rotate an HTML object without CSS3?

Upvotes: 0

Views: 4046

Answers (2)

appsthatmatter
appsthatmatter

Reputation: 6417

you can rotate in within an other canvas element, that can be rendered in html2canvas. here is an post about that workaround:

html2canvas and css transform rotate

Upvotes: 1

Nick N.
Nick N.

Reputation: 13559

(If you don't need to use the html2canvas library perse)

It's is not (yet) possible to rotate objects without the use of css. Some browsers (e.g. Firefox, Safari, Chrome) have there own transform tag which is explained here:

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

.transformed {
    -webkit-transform: rotate(15deg) scale(1.25, 0.5);
    -moz-transform: rotate(15deg) scale(1.25, 0.5);
    -ms-transform: rotate(15deg) scale(1.25, 0.5);
    transform: rotate(15deg) scale(1.25, 0.5);
}

Extra:

for images you could use the jquery rotating plugin:

https://code.google.com/p/jqueryrotate/

for other object rotations this may be a possible solution but I don't have any experience with it:

http://coursesweb.net/javascript/rotate-html-objects-div-span-image-jquery_t

Upvotes: 0

Related Questions