그림을 어떤 각도로든 회전시키고 JQuery 플러그인_jquery 사용을 소개합니다.

jQuery.fn.rotate = function(angle,whence) {
var p = this.get(0)
// 지속성을 위해 이미지 태그 내부에 각도를 저장합니다.
if (! whence) {
p.angle = ((p.angle==undefine?0:p.angle) 각도) % 360
} else {
p.angle = 각도
}
if (p.angle >= 0) {
var 회전 = Math.PI * p.angle / 180
} else {
var 회전 = Math.PI * (360 p.angle; ) / 180 ;
}
var costheta = Math.round(Math.cos(rotation) * 1000) / 1000
var sintheta = Math.round(Math.sin(rotation) * 1000) / 1000;
//alert(costheta "," sintheta)
if (document.all && !window.opera) {
var canvas = document.createElement('img')
canvas .src = p.src;
canvas.height = p.height;
canvas.width = p.width;
canvas.style.filter = "progid:DXImageTransform.Microsoft.Matrix(M11=" costtheta ", M12=" (-sintheta) ",M21=" sintheta ",M22=" costheta ",SizingMethod='auto Expand')"
} else {
var canvas = document.createElement(' canvas') ;
if (!p.oImage) {
canvas.oImage = new Image()
canvas.oImage.src =
} else {
캔버스 .oImage = p.oImage;
}
canvas.style.width = canvas.width = Math.abs(costheta*canvas.oImage.width) Math.abs(sintheta*canvas.oImage.height); 🎜>canvas .style.height = canvas.height = Math.abs(costheta*canvas.oImage.height) Math.abs(sintheta*canvas.oImage.width)
var context = canvas.getContext('2d' );
context.save();
if (rotation <= Math.PI/2) {
context.translate(sintheta*canvas.oImage.height,0)
}; if (회전 <= Math.PI) {
context.translate(canvas.width,-costheta*canvas.oImage.height)
} else if (회전 <= 1.5*Math.PI) {
context.translate(-costheta*canvas.oImage.width,canvas.height);
} else {
context.translate(0,-sintheta*canvas.oImage.width)
}
context.rotate(회전);
context.drawImage(canvas.oImage, 0, 0, canvas.oImage.width, canvas.oImage.height)
context.restore(); }
canvas.id = p.id;
canvas.angle = p.angle;
p.parentNode.replaceChild(canvas, p)
jQuery.fn.rotateRight = function(angle ) {
this.rotate(angle==undefine?90:angle);
}
jQuery.fn.rotateLeft = function(angle) {
this.rotate(angle== 정의되지 않음?- 90:-angle)
}