jQuery Cropper 使用说明

按照步骤说明：

一、头部引用css

<link rel="stylesheet" href="src/cropper.css">

二、body底部引用各种js

<script type="text/javascript" src="js/imagecropper/jquery.min.js"></script>
<script type="text/javascript" src="js/imagecropper/bootstrap.min.js"></script>
<script type="text/javascript" src="js/imagecropper/cropper.js"></script>

注意：jq版本不能低于10

三、各种方法使用

1：裁剪图片

function cutImg() {
$("#showEdit").fadeIn();
var $image = $('#report > img');
$image.cropper({
checkImageOrigin: true,
aspectRatio: 1 / 1,
autoCropArea: 0.5
});
}

2：确认头像，展示效果

//确认照片，展示效果
function confirm() {
$("#showEdit").fadeOut();
var $image = $('#report > img');
var dataURL = $image.cropper("getCroppedCanvas");//找死了
var imgurl=dataURL.toDataURL("image/png",1.0);//这里转成base64 image，img的src可直接使用
$("#changeAvatar > img").attr("src", imgurl);
}

3：旋转

//旋转照片
function rotateimg() {
$("#readyimg").cropper('rotate', 90);
}


function rotateimgleft() {
$("#readyimg").cropper('rotate', -90);
}

ios对内存有保护，本地没法旋转，需借助EXIF，还没用到，预留位置。