管理资源吧首页>>>教程>>>编程>>>JavaScript教程>>>

JavaScript控制图片360度旋转代码

<title>JavaScript控制图片360度旋转代码</title> 
<img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3D%22javascript%22%3E%20%0D%0Avar%20isIE%20%3D%20(document.uniqueID)%3F1%3A0%3B%20%0D%0Avar%20i%3D1%3B%20%0D%0Afunction%20rotate(image)%20%0D%0A%7B%20%0D%0Avar%20object%20%3D%20image.parentNode%3B%20%0D%0Aif(isIE)%7B%20%0D%0Aimage.style.filter%3D%22progid%3AdXImagetransform.Microsoft.basicImage(rotation%3D%22%2Bi%2B%22)%22%3B%20%0D%0Ai%2B%2B%3B%20%0D%0Aif(i%3E4)%20%7Bi%3D1%7D%3B%20%0D%0A%7D%20%0D%0Aelse%7B%20%0D%0Atry%7B%20%0D%0Avar%20canvas%20%3D%20document.createElement('canvas')%3B%20%0D%0Aif(canvas.getContext(%222d%22))%20%7B%20%0D%0Aobject.replaceChild(canvas%2Cimage)%3B%20%0D%0Avar%20context%20%3D%20canvas.getContext(%222d%22)%3B%20%0D%0Acontext.translate(176%2C%200)%3B%20%0D%0Acontext.rotate(Math.PI*0.5)%3B%20%0D%0Acontext.drawImage(image%2C0%2C0)%3B%20%0D%0A%7D%20%0D%0A%7Dcatch(e)%7B%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> 
<img id="myimg" src="http://files.glzy8.com/upload/201112/20111220005728433.jpg " _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2F201112%2F20111220005728433.jpg%20"/><br> 
<input type="button" value="旋转" onclick="rotate(document.getElementById('myimg'))" />

　　 [Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

教程首页更多教程