通过js修改图片的css样式,实现简单的图片旋转
html代码:
<img style="max-width: 700px; transform: rotate(360deg);" src="/image/test1.img" class="image1">
<input type="hidden" value="0" name="tran_num1">
<a href="javascript:;" class="rotate" image_id="1">旋转</a>
js代码:
$('.rotate').click(function () {
var id = $(this).attr('image_id');
var num = $('input[name=tran_num' + id + ']').val();
var num = Number(num) + 1;
var i = 90 * num;
$("#image"+id).css("transform", "rotate(" + i + "deg)");
if (num == 4) {
var num = 0;
}
$('input[name=tran_num' + id + ']').val(num);
})
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步