图片裁切插件jCrop的使用心得(一)
之前,项目经理为了提升用户体验让我在之前图片上传功能的基础上实现图片的裁切功能,作为一个前端小白来说听了这个需求心里一紧,毕竟没有做过,于是跟项目经理商量要先做下调研。在一上午的调研中发现了jCrop这个插件出现的概率最高而且也比较符合项目的要求并且网上的教程也很多,于是果断开始了对这个插件的实践。
先上做好的图片吧


首先,我是先看了一些网上的教程,这里列出一些网址,大家可以去参考。
http://code.ciaoca.com/jquery/jcrop/
http://www.zhangxinxu.com/jq/jcrop_zh/
基本上看了这两篇文章就能了解的差不多了,一个是API,一个是demo。
第一篇文章就当做一个简单的介绍吧,我不喜欢一篇文章里写太多内容,所以我将分几篇文章来写。
图片裁切插件jCrop的使用心得(一)的更多相关文章
- 图片裁切插件jCrop的使用心得(三)
在这一篇里,我来具体讲讲代码该如何写. 下面是jCrop的初始化代码 //图片裁剪插件Jcrop初始化 function initJcrop() { // 图片加载完成 document.getEle ...
- 图片裁切插件jCrop的使用心得(四)
在本篇中我来介绍一下jcrop如何实时展现用户裁切的效果图以及在项目中使用该插件注意的问题. 首先,你们在创建头像时,都可以在旁边实时的看到我裁切后的效果图,就如博客园. 这个是如何实现的呢,其实并不 ...
- 图片裁切插件jCrop的使用心得(二)
上一篇简单的介绍了一下开发的背景以及一些学习资料,下面开始介绍如何上手. 一.下载jCrop http://deepliquid.com/content/Jcrop_Download.html 直接去 ...
- jQuery 图片裁剪插件 Jcrop
Jcrop是一个jQuery图片裁剪插件,它能为你的WEB应用程序快速简单地提供图片裁剪的功能.特点如下: 对所有图片均unobtrusively(无侵入的,保持DOM简洁) 支持宽高比例锁定 支持 ...
- 网站开发常用jQuery插件总结(14)图片修剪插件Jcrop
一.插件功能 用于对图片进行修剪.但是在使用Jcrop时,还需要配合服务器端开发语言(如asp.net,php等)使用. 二.官方地址 http://deepliquid.com/content/Jc ...
- 支持移动端裁剪图片插件Jcrop(结合WebUploader上传)
(此教程包括前端实现图片裁剪,后端进行获取裁剪区并保存) 最近有一个需求,微信公众号上传图片,支持自定义裁剪. 以前用过一款裁剪插件cropper,很久没用了,不知道对移动端操作兼容如何,重新从网上搜 ...
- 开源JS图片裁剪插件
开源JS图片裁剪插件 一.总结 一句话总结: 要用点赞最高的插件,这样适用性最好,效果最好,出问题的概率也最低,这里电脑端和手机端都可以用的建议用 cropper.js 二.5款好用的开源JS图片裁剪 ...
- 推荐几款jquery图片切换插件
一.前言 毕业季到了,大家都在匆匆忙忙的记录大学里最美好的时光,照片中各种花式.各种姿势都涌现出来了.这么多的照片怎么展示出来给自己的好友看呢?有人选择做成视频,有人选择ps之后做成图片集,而我选择利 ...
- Cropper – 简单的 jQuery 图片裁剪插件
Cropper 是一个简单的 jQuery 图像裁剪插件.它支持选项,方法,事件,触摸(移动),缩放,旋转.输出的裁剪数据基于原始图像大小,这样你就可以用它们来直接裁剪图像. 如果你尝试裁剪跨域图像, ...
随机推荐
- [Practical Git] Show who changed a line last with git blame
When working on a file, we often want to know who made certain changes last; we can use git blame to ...
- 读写锁ReaderWriterLockSlim
读写锁的概念很简单,允许多个线程同时获取读锁,但同一时间只允许一个线程获得写锁,因此也称作共享-独占锁. 某些场合下,对一个对象的读取次数远远大于修改次数,如果只是简单的用lock方式加锁,则会影响读 ...
- a标签中关于javascript:void(0)的几个问题
最近看了好几个关于<a>标签和javascript:void(0)的帖子,谨记于此,以资查阅.注:以下代码未经全面测试,但每一种方法可能会出现的情况都基本做了说明. 在做页面时,如果想做一 ...
- C++ (P70—P96)
1 类的成员默认为私有模型 2 类的声明内不允许对数据成员进行初始化 3 类的成员函数,如果在类外定义,只需在函数类型之前加上inline就为内联函数了,如果在类内定义函数则该函数自动成为内联成员函数 ...
- swift 如何使用OC中宏的功能
swift中没有宏的概念,那么我们在swift使用宏的功能来提高效率呢? 一.使用关键字 let 来声明一个常量 存储相应的值,以下代码声明了常量 myColor 来存储一种指定的颜色 let my ...
- fail-fast机制
在JDK的Collection中我们时常会看到类似于这样的话: 例如,ArrayList: 注意,迭代器的快速失败行为无法得到保证,因为一般来说,不可能对是否出现不同步并发修改做出任何硬性保证.快速失 ...
- 我终于理解了LISP『代码即数据|数据即代码』的含义
以前我一直不能理解LISP里引用的作用,感觉引用和字符串没什么区别.比如:> (define (func) 'ok) > (func) 'ok 这里把引用ok当做了函数func的返 ...
- 在Activiti官方源码上提交的两个bugfix
前段时间在Activiti官方源码上提交了两个bugfix,截图为证. 第1个是BPMN model输出的bug:
- mount命令详解
http://tutu.spaces.eepw.com.cn/articles/article/item/70737 挂接命令(mount) 首先,介绍一下挂接(mount)命令的使用方法,mount ...
- GWT环境搭建--eclipse
上面下来需求,需要用到GWT,以前没接触过,搭个开发环境研究研究 安装软件我放在百度云盘里了(其他版本自己找,我的版本 eclipse4.4 luna gwt2.7) 链接:http://pan.b ...