1. 首頁 > 生活 > >

js圖片上傳方法 JS上傳圖片

小知識JS上傳圖片js圖片上傳方法



文章插圖
js圖片上傳方法 JS上傳圖片

文章插圖
很多時候，我們都需要對圖片進行裁剪、縮放、旋轉等操作，比如：上傳用戶的LOGO，基本都需要裁剪功能的 。那么一個好用的裁剪插件，勢必會提高用戶的體驗度 。
我們先來看一個裁剪圖片，可能的效果和必須的功能，如下圖：
從此圖上，我們看出，四角可以拖拽縮放來裁剪，同時生產多張不同尺寸的小圖，下邊的功能按鈕，還可以旋轉圖片、縮放、預覽等 。
上圖如何實現呢？今天，推薦給您一款jQuery插件：Cropper.js 。
那么什么是Cropper.js呢？
它是一個簡單的jQuery圖片裁剪插件 。同樣的，我們推薦用不依賴jQuery的Cropper.js庫 。
那么它有哪些特點呢？
支持jQuery1.9.1+的依賴、支持無jQuery的裁剪庫；
支持38個配置選項、支持27個方法、支持6個事件；
支持移動端、支持縮放 旋轉 等比縮放、支持多個裁剪；
支持在Canvas上裁剪、支持讀取圖片Exif信息、支持跨瀏覽器裁剪等 。
那么如何獲取它呢？
你可以到github上搜索：Cropper，它有2個版本，一個是依賴jQuery的，一個是不依賴jQuery的（Cropper.js） 。推薦用不依賴的js庫 。
那么如何使用它呢？
通過上圖，我們可以很快的用起來，至于配置信息，你可以到github上查閱 。這里不一一列舉了 。
對于用戶使用時，都有哪些常見問題？
【js圖片上傳方法 JS上傳圖片】比如：通過shift鍵來等比例裁剪圖片；通過雙擊鼠標進入裁剪模式、移動模式等 。
看著是不是很心動，有空就用一下吧，說不定哪天領導就讓弄個這樣的功能 。不至于讓我們手足無措 。