JQuery
jqueryRotate is awesome, it can rotate images in every browser known to man. http://code.google.com/p/jqueryrotate/ Except that it breaks the ability to drag. (Easily fixable.)
Unfortunately, the crazy backflips necessary for IE7 and IE8 (VML) also breaks resizing because the image is actually hidden and a VML context is manipulated in it’s place. This is not easily fixable. The crazy resolution is to manipulate the DOM to destroy and recreate the image on each resize attempt.
Here is the code: //
Destroy the image, cause once it has been rotated, it can’t be resized. myObj = document.getElementById(‘img1’); myPar = myObj.parentNode; myPar.removeChild(myObj);
// Recreate the image, cause we can’t do without it. var img = document.createElement(‘img’); document.getElementById(‘div1’).appendChild(img); img.setAttribute(‘id’, ‘img1’); img.setAttribute(‘src’, ‘images/Image1.png’); img.setAttribute(‘style’, ‘position:absolute;’);
// Resize it $(“#img1”).css({ height: 99, width: 101 }); // Rotate it back $(“#img1”).rotate(rotValue); Kind of drastic, but hey it works.
See issue as reported by me (with fix): http://code.google.com/p/jqueryrotate/issues/detail?can=2&start=0&num=100&q=&colspec=ID%20Type%20Status%20Priority%20Milestone%20Owner%20Summary&groupby=&sort=&id=61
See our CMS Support Page for more information!