Html5移动端上传图片并裁剪 - Clipic.js

Clipic.js插件可以为移动端 (仅支持移动端) 提供头像上传并裁剪成指定尺寸，用原生js开发的，轻量级，包含html跟css，不到8kb。点此链接体验： https://teojs.github.io/clipic/

https://github.com/teojs/clipic

参数说明

width:Number (默认：500) – 裁剪宽度

height:Number (默认：500) – 裁剪高度

ratio:Number (可选) – 裁剪的比例，当传入ratio时width/height将无效

src:String (必传) – 需要裁剪的图片，可以是图片链接，或者 base64

type:String (默认：jpeg) – 裁剪后图片的类型，仅支持 jpeg/png 两种

quality:Number (默认：0.9) – 压缩质量

buttonText:Array (默认：[‘取消’, ‘重置’, ‘完成’]) – 底部三个按钮文本

http://bbs.itying.com/topic/5cb17892c6a71b10bcef96b0

其实就是上传文件，方便点的下载个fileupload 插件，将文件转换成流，然后再写出到指定的路径，将存储路径存储在数据库中。再好点的，可以将这个头像文件做一次压缩处理，原图一个路径，压缩图一个路径。压缩图路径展示小图，原图路径展示原图。一般这个路径都是基于工程的相对路径。

加载用户头像

要么是背景图片background:url()

要么是<img src="">

没有其他情况了，剩下的就是后台 *** 作，传值过来

---