在firefox下如何旋转图片？？

mengqianye 2007-12-13 09:36:11

IE中有滤镜，所以要旋转图片很方便，firefox下没有滤镜，有没有什么方法可以旋转图片？？

...全文

762 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

skylence 2011-04-12

打赏
举报

5楼的在火狐里面图像旋转后怎么只有图像一部分

siru90 2011-04-12

打赏
举报

非常感谢！

frankiehuang 2008-06-25

打赏
举报

感谢楼上！！

瑞吉斯风隐 2008-04-14

打赏
举报

写了个小函数，可以兼容IE和FireFox,希望对需要的人有帮助

<script language="javascript">
var isIE = (document.uniqueID)?1:0;
var i=1;
function rotate(image)
{
var object = image.parentNode;
if(isIE){
image.style.filter="progid:DXImageTransform.Microsoft.BasicImage(Rotation="+i+")";
i++;
if(i>4) {i=1};
}
else{
try{
var canvas = document.createElement('canvas');
if(canvas.getContext("2d")) {
canvas.id = image.id;
canvas.alt = image.alt;
canvas.name = image.name;
canvas.title = image.title;
canvas.className = image.className;
canvas.style.cssText = image.style.cssText;
canvas.height = image.height;
canvas.width = image.width;
object.replaceChild(canvas,image);

var context = canvas.getContext("2d");
context.translate(120, 0);
context.rotate(Math.PI*0.5);
context.drawImage(image,0,0);
}
}catch(e){}
}
}
</script>
<img id="myimg" src="Sylar.gif" height="120" width="120" /><br />
<input type="button" value="rotate" onclick="rotate(document.getElementById('myimg'))" />

mengqianye 2007-12-13

打赏
举报

不换图片有办法吗？？

原装匪兵甲 2007-12-13

打赏
举报

在图片下方加上一行文字说明：请将您的脑袋顺时针倾斜90度。

buxiangwei 2007-12-13

打赏
举报

换一张图片

zwd2005 2007-12-13

打赏
举报

http://developer.mozilla.org/en/docs/HTML:Canvas

<html>

 <head>

  <script type="application/x-javascript">

function draw() {

	var PI = 3.14;

	var canvas = document.getElementById("canvas");

	var ctx = canvas.getContext("2d");

	var img = new Image();

	img.src = "http://www.csdn.net/images/newcsdnlogo.gif";

	

	ctx.translate(150,150);

	ctx.rotate (PI/2);	

	

	ctx.drawImage(img, 0,0);

}

  </script>

 </head>

 <body onload="draw()">

   <canvas id="canvas" width="300" height="300"></canvas>

 </body>

</html>