20 個具有驚豔效果的 jQuery 影像縮放外掛

　　jQuery相對與Flash的魔力已經貫穿整個網路。儘管，Flash層被認為是用於網頁設計的首選，然而隨著jQuery的出現，以及他的酷似Flash的互動式特效使得網頁更加的優雅——Flash開始靠邊站了。

　　相比笨重的Flash，使用jQuery可以輕鬆的建立複雜的自定義動畫效果以及提供友好的SEO，因此在兩者之間的選擇也就是明擺著的事兒了。

　　一些酷炫的jQuery 圖片效果，類似於不同方向滑入，輕鬆新增動畫，擲入、排序、放大效果，搖拍，圖片拍攝效果，滑動效果以及大量其他的僅僅需要少量編碼的特效使得jQuery稱為開發者和網站製作的首選。

　　下面的jQuery外掛對含有需要大量空間的巨型圖片的網站非常有用–通常有這樣沉重的影像負載的網站，其載入過程會非常慢，但通過這些 jQuery 影像外掛，影像不僅能夠用無限的特效呈現視覺刺激，而且頁面載入的速度也會達到標準。

　　這裡介紹的是20個jQuery影像縮放外掛的演示，它們可以描繪出無數的影像效果，可以被利用來為終端使用者提供一個更誘人的視覺體驗。享受它們吧！

　　1. ElevateZoom 

　　ElevateZoom是一個可以輕鬆建立影像縮放介面的高度可定製jQuery外掛。它可以對一個單獨的高品質影像或兩幅影像（一個縮圖和一個高品質版本）進行工作。縮放視窗可以放置在頁面（或影像）的任何部分，還有一個選項可以內建縮放以節約視覺空間。

　　2. Mlens

　　mlens，是一個很小的jQuery外掛（minified 和 gzipped 之後只有約 1KB），簡化建立了這個放大鏡的很多功能。它有幾個引數，如鏡片的形狀（圓形或方形）、鏡頭的尺寸，以及定製邊界的選項。它的多個例項可以用在同一頁面，其WordPress外掛正在開發中。

　　3. Cloud Zoom

　　Cloud Zoom 是許多高知名度的零售網站都使用的一個橫空出世的流行jQuery影像縮放外掛。持續改進，定期更新和技術支援使它成為那些為了客戶而需要一個成熟、可靠的jQuery影像縮放解決方案的忙碌開發者們青睞的選擇。

　　4. Nivo Zoom

　　Nivo Zoom 是一個類似Lightbox但更為簡單的影像縮放jQuery外掛，來自流行的 Nivo Slider 的開發者。此外掛是輕量級的（壓縮後只有4KB），只集中在影像上，並配備了一堆的設定。它支援5種不同的變焦型別，並可以顯示影像的標題（能很好處理長文字）。

　　5. FancyBox

　　FancyBox 是一個可以為你網頁上的影像、HTML內容和多媒體提供漂亮和優雅的縮放功能的工具。它建立在流行的JavaScript框架jQuery之上，易於實施和定製。

　　6. Zoomy

 

　　Zoomy 是一個快速和易於整合的外掛，可以放大任何圖片。它是一個靈活的縮放外掛，可以用於同一影像的兩個拷貝，或者一個連結到其自身的影像。大多數的CMS系統會儲存或建立同一影像的多個尺寸版本，所以它可以被輕鬆設定。只需在所顯示的較小的影像上鍊接較大的放大影像，並告訴外掛縮放時使用該連結即可。這隻需要一點點指令碼。

　　7. EasyZoom

　　EasyZoom 是一個優雅的、高度優化的jQuery影像放大和平移外掛，它基於 Alen Grakalic 的工作。EasyZoom 支援觸控式裝置，並很容易用CSS定製。

　　8. jQuery Zoom

 

　　jQuery Zoom 是一個jQuery的小外掛，用於在 mousedown 或 mouseover 時放大影像。它已經在 Firefox，Safari，Chrome，Internet Explorer 6、7、8、9，和 Opera 11 下測試通過。它遵循MIT協議釋出。

　　9. Zoomooz.js

　　Zoomooz.js 是個易用的可以對任意網頁元素進行放大的jQuery外掛。你只要對任意 HTML 元素新增名為“zoomTarget”的class，就可以對其新增放大效果。放大可以通過點選body來重置。它在Internet Explorer 9, Safari 3+, Firefox 3.6+, Opera 和 Chrome 上測試通過。

　　10. Easy Image Zoom

　　Easy Image Zoom 是一個輕量極的 jQuery 外掛，允許使用者在中等尺寸的影像上移動滑鼠時看到更大的細節。它可以通過幾個選項和簡單的CSS定義實現定製。它適用於需要產品影像放大的專案。

　　11. jPhotoGrid

　　jPhotoGrid 接收一個簡單的影像和標題列表，然後把它們變成一個可被檢視和縮放的照片網格。幾乎這個外掛所有的風格都是在CSS中定義的，訣竅是通過浮動（float）列表項來佈局網格。該外掛將做的第一件事，就是把這些都絕對定位。這就是為什麼外掛能在一個單獨的影像上放大然後把它返回到它原來的地方。

　　12. jZoom Evolution

　　jQZoom Evolution（進化）是一個有全部功能的 jQZoom 的新版本。它是一個建立在流行的 JavaScript 框架 jQuery 之上的 JavaScript 影像放大鏡。它正是你所需要的放大鏡指令碼，很棒而且非常易用。它很容易定製，並能在所有時髦瀏覽器中工作。本軟體按GPL協議授權使用。你可以在你的網站上使用 jQZoom，無論是電子商務網站還是任何其它型別。

　　13. Fresco

　　Fresco（壁畫）是一個美麗的響應式燈箱。它能夠在每種裝置上的所有瀏覽器中創造驚人的覆蓋，並在任何尺寸的螢幕上完美工作。更為驚豔的是它還可以全屏縮放，有支援視網膜技術的皮膚，支援刷卡事件，為HTML5視訊整合了YouTube和Vimeo，有強大的JavaScript API。

　　14. jQuery Snipe

　　Snipe 是一個可以給圖片加上狙擊鏡風格的 jQuery 縮放外掛。當滑鼠在圖片上滑過時，Snipe 會在滑鼠位置加上實時放大效果，就好像你拿著AWP端詳你的獵物。

　　15. ZoomImage

　　用個性方式表現你的影像。指向影像的連結被悄悄劫持了，取而代之的是在頁面內彈出的帶有陰影和邊框的DIV裡顯示影像。

　　16. Mosaiqy

　　Mosaiqy是一個用於檢視和縮放照片的jQuery外掛，工作於Opera9+，火狐3.6+，Safari3.2+，Chrome和IE7+。照片是從一個JSON/JSONP資料結構中檢索的，隨機在網格內移動。在最新的瀏覽器中使用CSS3過渡通過你的GPU接管所有昂貴的動畫，最大限度地減少CPU開銷。 （對於技術細節請參見GitHub專案的README檔案）。

　　17. Anything Zoomer

　　Anything Zoomer 給你的圖片提供一個近距離放大檢視。

　　18. jQuery gZoom Plugin

　　它有如下特點：點選“+”和“－”按鈕縮放；可以在影像上用滑鼠滾輪拖動滑動條來變級縮放；放大後在影像上移動滑鼠可以平移；點選影像可以用 lightbox 風格顯示全圖。

　　19. Leroy Zoom

　　小於 4KB 的一個輕量和易於使用的影像放大jQuery外掛。

　　20. ImageLens

　　Imagelens 可以讓你為影像新增透鏡式放大效果。

　　原文地址：http://codegeekz.com/20-jquery-image-zoom-plugins-for-stunning-effects/