這個應用的關鍵： 　1.讓左邊選擇區域和右邊顯示的圖像信息保持一至。 　2.根據左邊選擇區域的大小，來讓右邊有一個對局部放大或縮小的效果。 3.后台上傳功能。 　　那么這一次，只談[放大]或[縮小]。[位置]和[上傳]問題，下次，我再寫下(因為那個插件代碼太多，我也沒看完，正在 ...

插件介紹 這是一個我在寫以前的項目的途中發現的一個國人寫的jQuery圖像裁剪插件，當時想實現用戶資料的頭像上傳功能，並且能夠預覽圖片，和對圖片進行簡單的裁剪、旋轉，花了不少時間才看到了這個插件，感覺功能挺全面，代碼實現起來也挺簡單，再加上用的是Bootstrap，對移動端操作也有適配，於是就 ...

在做頭像上傳的時候，瀏覽器默認是無法取得本地圖片的，當然 HTML5 是可以的。不過IE6-8怎么破？目前比較通用的方案都是 flash 解決。 說道頭像預覽和裁剪，我最熟悉的就是 Discuz 的那個了，非常方便好用。不僅可以選擇本地圖片，還能直接調用攝像頭拍攝，當然前提是你必須有個攝像頭 ...

Imgareaselect 是一個 允許用戶使用簡單、直觀的點擊、拖動界面圖像選擇矩形區域的jQuery插件。該插件可用於 web 應用程序中輕松實現圖像裁剪功能，以及其他功能，如照片標記、 圖像編輯功能，等等. 支持瀏覽器： Firefox 2+, Opera ...

最近工作真心忙碌，幾乎沒時間寫博客。今天趁周末來仿一個QQ頭像裁剪功能插件。效果如下： 所有文件都可在我的Github上下載，從頭到尾從簡到繁按步驟一共分了9個HTML文件，每個步驟文件里的注釋都寫的很清楚，故在本博客內不贅述。 原理： 主要是通過css的clip來裁剪圖片可視區 ...

最近由於項目需要，所以做了一個上傳頭像預覽並且可以預覽裁剪的功能，大概思路是上傳的圖片先保存到服務器，然后通過ajax從服務器獲取到圖片信息，再利用Jcrop插件進行裁剪，之后通過PHP獲取到的四個裁切點的坐標進行裁剪。 首先看一下uploadify上傳插件的API： uploader ...

效果 頁面結構 JS代碼 需要注意的是如果使用jQuery 1.9及以上版本移除了$.browser可以使用$.support來替代 ...

（本文原創，引用請注明出處--zhangjieatbky） 環境准備 准備jquery、jcrop的js和css（官網獲取）、jquery的文件上傳下載組件 html代碼 ...