1.实现功能
当图片被缩小放置到一个固定大小的div内,以下代码通过jquery.rotate组件实现点击查看原图并且90度顺时针旋转。
2.代码
js引入
<script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../js/jquery.rotate.min.js"></script>
js代码
$("#ImgPath1").rotate({
bind:
{
click: function(){
if(value1==270){
$(this).css("width","100%");
$(this).css("max-height","200px");
value1 +=90;
$(this).rotate(value1);
value1 = 0;
}else{
var img = new Image();
img.src =$(this).attr("src") ;
var imgWidth = img.width; //图片实际宽度
var imgHeight = img.height;
$(this).attr("style","width: "+imgWidth);
$(this).attr("style","height: "+imgHeight);
value1 +=90;
$(this).rotate(value1)
}
}
}
});
3.个人标示
caicongyang:http://blog.csdn.net/caicongyang