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);//裁剪图片的高度

};