cropper.js头像修改成圆形框的方法

1. cropper.js

在cropper.js中找到 getCroppedCanvas方法 在context.drawImage.apply上添加


var circle = {
x: canvasWidth / 2,
y: canvasHeight / 2,
r: canvasWidth / 2
};

context.arc(circle.x, circle.y, circle.r, 0, Math.PI * 2, false);
context.clip();

2.cropper.css

.cropper-face 添加border-radius: 100%;
.cropper-view-box 删除outline outline-color
添加 border: 2px solid #39f;
border-color: rgba(51, 153, 255, .75);
border-radius: 100%;

posted @ 2019-05-28 10:12  北执666  阅读(1408)  评论(0编辑  收藏  举报