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%;


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM