JQ剪辑图片插件，适用于移动端和PC端
Posted DavidPan
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JQ剪辑图片插件，适用于移动端和PC端相关的知识，希望对你有一定的参考价值。
主要用到以下JS文件：
<script src="js/photo/iscroll-zoom.js"></script>
<script src="js/photo/hammer.js"></script>
<script src="js/photo/lrz.all.bundle.js"></script>
<script src="js/photo/jquery.photoClip.js"></script>
记得在页面加载完成后初始化插件：
var clipArea = new bjj.PhotoClip("#clickArea", {
size: [254, 246], //编辑区域的宽高
outputSize: [254, 246], //编辑完成后输出的图片尺寸
outputType: "png",
file: "#file", //input框的ID
view: "#view", //编辑区域
ok: "#clickBtn", //剪切按钮
loadStart: function() {
console.log("照片读取中");
},
loadComplete: function() {
console.log("照片读取完成");
},
loadError:function(event){
alert("照片读取失败");
console.log(event);
},
clipFinish: function(dataURL) {
console.log(dataURL);
}
注意:
clickArea、clickBtn、view、file四个要在同一个页面上。
Github地址：https://github.com/baijunjie/jQuery-photoClip
以上是关于JQ剪辑图片插件，适用于移动端和PC端的主要内容，如果未能解决你的问题，请参考以下文章
前端压缩图片代码，支持移动端和pc 端，还有拍照后获取到的照片