cropper初始化_简单好用，极易上手的图片截取截图插件cropper.js

项目中需要配合以图搜图功能，于是呢，就需要相应的截图程序功能。市面上现在有很多的图片截取插件。今天，我结合自身的使用经历。看看cropper.js如何轻易上手，完成图片截图功能。演示地址：https://fengyuanchen.github.io/cropperjs/

github地址：https://github.com/fengyuanchen/cropperjs

html：

确定

javascript：var $image = $('#cropTestImg');

/* 初始化配置 */

$image.cropper({

movable: false,

zoomable: false,

rotatable: false,

scalable: false,

autoCropArea:0.5,

minCropBoxWidth:100,

minCropBoxHeight:100

});

/* 点击获取图片的裁剪大小 */

$('#cropEndBtn').on('click',function(){

var imageData = $image.cropper('getData');

console.log(imageData);

/* 结果如下 Object {x: 212.36363636363637, y: 76, width: 338.90909090909093, height: 256.3636363636364} */

});

通过上面简单的配置cropper.js，就可以实现各种自己想要的截图功能。真的简单好用，极易上手。