html：
<div id="windowImgZoomIn" class="easyui-window" title="图片预览" data-options="modal:true,closed:true,minimizable: false,maximizable: false,collapsible: false" style="width: 80%; height: 90%; padding: 3px; text-align: center;">
<div>
<div class="menuBox">
<div class="RotateLeft menu mleft zoom_left">
<img src="/Static/images/Undo.png" />
向左转
</div>
<div class="RotateRight menu mright zoom_right">
向右转
<img src="/Static/images/Redo.png" />
</div>
</div>
</div>
<div id="windowImgZoomIn_img" style="width: 100%; height: 100%;">
<img />(这里是动态加载的img图片)（最好一个img用一个li包住，在点击旋转时，img会转成canvas，但是 被li包住的img没有转成canvas）
</div>
<div id="windowImgZoomIn_icon">
<img class='fd_zoomimg_prev' src='Static/images/prev.png' style='position: absolute; left: 0; top: 50%; cursor: pointer;' />
<img class='fd_zoomimg_next' src='Static/images/next.png' style='position: absolute; right: 0; top: 50%; cursor: pointer;' />
</div>
<div id="windowImgZoomIn_info" style="position: absolute; bottom: 5px; width: 100%;">
<div id="windowImgZoomIn_info_num" style="width: 50px; height: 25px; line-height: 25px; background-color: rgba(120, 120, 120, 0.5); border-radius: 14px; margin: 0 auto; text-align: center; color: #fff;">
</div>
</div>
</div>
css：
.menuBox {
display: block; margin: 3px auto; height: 22px; width: 150px; position: absolute; right: 10px; top: 35px; z-index: 999;
}
.menuBox .menu {
width: 65px;
border: 1px solid #a2a2a2;
float: left;
font-size: 12px;
vertical-align: middle;
height: 17px;
line-height: 17px;
position: static;
border-color: #ddd;
color: #444;
}
.menuBox .mleft {
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
padding-right: 5px;
text-align: right;
}
.menuBox .mright {
border-left: 0;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
padding-left: 5px;
text-align: left;
}
.menuBox .menu:hover {
background-color: #dedede;
cursor: pointer;
}
.menuBox .menu img {
vertical-align: middle;
}
js：
$(function () {
//图片旋转
$(".zoom_left").click(function () {
var Angle = -90;
var idx_jzzp = idx;
var curimg = $("#idx_" + idx_jzzp);
curimg.rotate(Angle);
});
$(".zoom_right").click(function () {
var Angle = 90;
var idx_jzzp = idx;
var curimg = $("#idx_" + idx_jzzp);
curimg.rotate(Angle);
});
})