Jcrop裁剪图片
??? 需要引用的文件
??? <script type="text/javascript" src="<%=basePath %>Jcrop/js/jquery-1.8.3.min.js"></script>
??? <script type="text/javascript"src="<%=basePath %>Jcrop/js/jquery.Jcrop.js"></script>
??? <link rel="stylesheet" href="<%=basePath %>Jcrop/css/jquery.Jcrop.css" type="text/css"/>
//其中TestImage为一个img的id
<img src='a.jpg' id='TestImage' onmouseover='mousover()'? />
?
function mousover(){
??? jq('#TestImage').Jcrop({
??? ??? minSize: [655,310],
??? ??? aspectRatio:2,//选择框的比例。（1为正方形，2为横着的长方形）
??? ??? onChange: updateCoords,
??? ??? onSelect: updateCoords,
??? ??? allowResize:true
??? ??? });
???
}
function updateCoords(c){
jq('#x').val(c.x);//得到选中区域左上角横坐标
jq('#x').val(c.y);//得到选中区域左上角纵坐标
jq('#x').val(c.x2);//得到选中区域右下角横坐标
jq('#y').val(c.y2);//得到选中区域右下角纵坐标
jq('#w').val(c.w);//裁剪图片的宽度
jq('#h').val(c.h);//裁剪图片的高度
};
?
