素材牛VIP会员

移动端图片上传截取插件photoClip.js

 所属分类:网页特效-图片裁剪,上传

 浏览:1235次  评论:0次  更新时间:2019-04-03
牛币素材VIP可免积分下载
移动端图片上传截取插件photoClip.js兼容IE10
积分说明:注册即送10牛币,每日签到可获得5牛币,成为VIP会员可永久免牛币下载!   充值积分   充值会员   更多说明»
素材描述:支持手势的裁图插件,在移动设备上双指捏合为缩放,双指旋转可根据旋转方向每次旋转90度 ,在PC设备上鼠标滚轮为缩放,每次双击则顺时针旋转90度。
 标签:裁图上传

详细介绍

支持手势的裁图插件

在移动设备上双指捏合为缩放,双指旋转可根据旋转方向每次旋转90度

在PC设备上鼠标滚轮为缩放,每次双击则顺时针旋转90度

 * @option_param {number} width 截取区域的宽度

 * @option_param {number} height 截取区域的高度

 * @option_param {string} file 上传图片的<input type="file">控件的选择器或者DOM对象

 * @option_param {string} view 显示截取后图像的容器的选择器或者DOM对象

 * @option_param {string} ok 确认截图按钮的选择器或者DOM对象

 * @option_param {string} outputType 指定输出图片的类型,可选 "jpg" 和 "png" 两种种类型,默认为 "jpg"

 * @option_param {boolean} strictSize 是否严格按照截取区域宽高裁剪。默认为false,表示截取区域宽高仅用于约束宽高比例。如果设置为true,则表示截取出的图像宽高严格按照截取区域宽高输出

 * @option_param {function} loadStart 开始加载的回调函数。this指向 fileReader 对象,并将正在加载的 file 对象作为参数传入

 * @option_param {function} loadComplete 加载完成的回调函数。this指向图片对象,并将图片地址作为参数传入

 * @option_param {function} loadError 加载失败的回调函数。this指向 fileReader 对象,并将错误事件的 event 对象作为参数传入

 * @option_param {function} clipFinish 裁剪完成的回调函数。this指向图片对象,会将裁剪出的图像数据DataURL作为参数传入

文件目录结构

  • css
    • ┝ style.css
  • images
    • ┝ tx.png
  • ┝ index.html
  • scripts
    • ┝ hammer.js
    • ┝ iscroll-zoom.js
    • ┝ jquery-1.8.2.min.js
    • ┝ jquery.photoClip.js

讨论这个素材(0)回答他人问题或分享使用心得会奖励牛币

〒_〒 居然一个评论都没有……

 文明上网,理性发言!   😉 阿里云幸运券,戳我领取
我的牛币余额:0
所需牛币:10 开始下载

牛币获取:签到、评论、充值    » 在线充值(10牛币=1元)