之前接触过一点jcrop,时间长了就忘记了,最近偶尔一使用,居然出了很多问题,导致花了很长时间才调试成功。下面与大家分享一下心得。
一、CSS的引用
<link rel="stylesheet" href="../css/Jcrop.css" type="text/css"/>
像上面一样,类似这样的引用即可。
二、JS的引用
JS的引用就得讲究了,因为顺序不对,一定出问题。正确的顺序如下:
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/Jcrop.js"></script>
注意了,由于jcrop是jquery的一部分,因此,引用的时候,jquery一定要引用在Jcrop的上面,否则,顺序反了,就没有任何效果了。
知识拓展:什么是Jcrop
Jcrop是一个jQuery插件,它能为你的WEB应用程序快速简单地提供图片裁剪的功能。
特点:
对所有图片均unobtrusively(无侵入的,保持DOM简洁)
支持宽高比例锁定
支持 minSize / maxSize设置
支持改变选区或移 动选区时的回调(Callback)
支持用键盘微调选 区
通过API创建互 动,比如动画效果
支持CSS样式