Browse > Home > HTML5 > HTML5版头像上传组件

| Subcribe via RSS

HTML5版头像上传组件

四月 11th, 2011 | 1,019 views | Posted by flashlizi in HTML5

头像上传是绝大多数的SNS、微博网站都有的一项功能,不过这个功能大部分都是用flash实现的。这个功能用HTML5的File API和Canvas配合也可以很好的实现:http://www.riaidea.com/html5/cropper/

功能说明:
* 可通过移动、缩放和旋转等操作设置图片的裁剪区域。
* 可实时多尺寸预览裁剪图片区域。
* 可通过ajax提交裁剪的图片到服务器。(本示例中不能进行此项操作)
* 如果你的浏览器不支持FileReader,此组件将无法正常运行。目前支持的浏览器有Firefox3.6+,Chrome10+等。

源码下载:ImageCropper

6 Responses to “HTML5版头像上传组件”

  1. sosowy Says:

    请问有imagecropper.min.js未压缩的源码吗?供小弟学习吧,万分感谢


  2. flashlizi Says:

    源码已经提供下载了。


  3. sosowy Says:

    非常感谢,很有爱的站主~


  4. xiaoxu Says:

    这个非常棒,但是还想请教一下:对于不支持FileReader的浏览器来说,应该如何实现?有现成的解决方案吗?或者有现成的思路?呵呵。菜鸟请教。


  5. flashlizi Says:

    对于不支持FileReader的浏览器可能就要借助其他办法了,比如Flash。。。


  6. xiaoxu Says:

    可不可以先上传到服务器上去,然后用Load资源的方法来取得图片呢?因此,在HTML5中,如何获得远程图片的Content?


Leave a Reply