jQuery图片旋转插件jQueryRotate.js用法实例

jQuery图片旋转插件jQueryRotate.js用法实例

纯javascript代码实现浏览器图片预览时可以旋转
自己从网上找了半天,发现网上写的不是很全,我实现起来很费劲,决定写了这个文档,希望帮助有这样的需求的同类人员,少走弯路。
废话不多说,直接进入代码讲解部分,

原来的效果如下图

在这里插入图片描述
这个没有对图片进行选择的功能,客户要求能对图片进行旋转。

下面是做好的效果图

在这里插入图片描述
单击旋转图片或者2222可以旋转90度,如下图所示
在这里插入图片描述
再次单击如下图所示
在这里插入图片描述

现在我开始代码截图

1,首先引用js
在这里插入图片描述
2.在页面添加如下红色代码
在这里插入图片描述
说明:绿色的代码是之前的写法,红色部分是新增的代码
页面还要加入弹出框的代码如下
在这里插入图片描述
并且新建个页面如下
在这里插入图片描述
3.在相应的js中添加如下代码
function contContext(realName) {

           $("#main").attr("src", "../../abs/financing/downloadFileNew.htm?realName="+realName);
$("#contractVerificationCode").modal('show');

 /*   }
});*/

}
var num = 0;
function fdsf() {
num ++;
//$(’#img2’ ).rotate(90);
$("#main").rotate(90*num);
}
就可以实现的了

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值