Js圖片裁切框專用插件(圖片處理) 免費版

Js圖片裁切框專用插件是一款準們針對Js圖片的圖片處理工具，該文件體積僅有202KB，別看Js圖片裁切框專用插件體積小功能卻十分強大，裁切框可以隨意用鼠標拖動，輸入保存的名稱，可以點擊那個保存按鈕進行保存。

【Js圖片裁切框專用插件三種方式的裁切框使用演示】：
 Demo1：隨意拖動位置和大小
Demo2：隨意拖動位置,鎖定尺寸大小.
Demo3：隨意拖動位置,保持尺寸寬高比

【Js圖片裁切框專用插件代碼展示】：
jQuery+CSS實現Ajax圖片裁切功能 展示 crop.js源代碼
返回 下載jQuery+CSS實現Ajax圖片裁切功能： 單獨下載crop.js源代碼 - 下載整個jQuery+CSS實現Ajax圖片裁切功能源代碼 - 類型：.js文件
1.$(function(){
2. //初始化圖片區域
3. var myimg = new Image();
4. myimg.src = $("#mypic2").attr("src");
5. //輸出圖片數據
6. $("#showSize").html(myimg.width + "×" + myimg.height);
7.
8. //初始化圖片的位置，根據圖片的寬度調整左右
9. $("#statistics, #picArea").css("left",$(window).width()/2-myimg.width/2);
10. $("#picArea").width(myimg.width).height(myimg.height);
11. var parentWidth = parseInt($("#picArea").width());
12. var parentHeight = parseInt($("#picArea").height());
13.
14. //顯示鼠標的相對於圖片的坐標（左上角為(0,0)）
15. var offsetX = parseInt($("#picArea").css("left"));
16. var offsetY = parseInt($("#picArea").css("top"));
17. $("#mypic").bind("mousemove",function(e){
18. $("#xPos").text(e.pageX-offsetX);
19. $("#yPos").text(e.pageY-offsetY);
20. }); 等等!!