8 款超絢麗的 jQuery 焦點圖動畫

本文由碼農網 – 小峰原創，轉載請看清文末的轉載要求，歡迎參與我們的付費投稿計劃！

隨著前端技術和瀏覽器技術的不斷髮展，人們開始對網頁視覺效果的要求越來越高。我們經常會在頁面中看到很多炫酷的圖片焦點圖播放控制元件，有些甚至是大屏的焦點圖佔用大片的頁面空間，從而吸引使用者的眼球。本文要分享的就是一些超絢麗的jQuery焦點圖動畫外掛，有些不僅基於jQuery，還帶有CSS3的動畫特效，因此顯得更加炫酷。

1、jQuery實用圖片滑塊焦點圖 支援移動端滑動

今天我們要再來介紹一款jQuery實用圖片滑塊焦點圖，它也支援移動端的觸屏滑動，這款外掛並沒有特別的動畫效果，但方便實用。

線上演示        原始碼下載

2、HTML5/jQuery 3D焦點圖外掛 多種超酷切換動畫

之前我們分享過一些很酷的焦點圖外掛了，有些是基於jQuery的焦點圖應用，今天我們要分享一款基於HTML5和jQuery的3D焦點圖外掛，該HTML5焦點圖有多種超酷的切換動畫，包括3D百葉窗、3D翻轉等特效，有些切換效果在高版本Chrome中有效果。

線上演示        原始碼下載

3、jQuery自動滑塊焦點圖外掛 帶縮圖

今天我們再來介紹一款比較實用的jQuery焦點圖外掛，它的特點是可以自動播放圖片，並可以設定暫停。另外，這款焦點圖的圖片切換動畫也比較多樣化，而且在圖片下方的切換按鈕上滑鼠懸停將會出現當前圖片的縮圖，並沒有炫酷的動畫，總體來講是一款比較實用的jQuery焦點圖。

線上演示        原始碼下載

4、jQuery/CSS3實現全屏圖片滑塊焦點圖動畫

今天我們要來分享一款非常大氣的jQuery/CSS3全屏焦點圖外掛，這款焦點圖有以下幾個特點：首先圖片可以全屏切換滑動，顯得非常大氣；其次焦點圖有縮圖導航，點選縮圖可以切換至相應的圖片；最後就是圖片有陰影，配合天空白雲的背景，像是浮動一樣，非常立體。

線上演示        原始碼下載

5、jQuery圖片垂直滾動焦點圖 導航帶圖示

今天我們要再來分享一款很實用的jQuery焦點圖外掛，這款jQuery焦點圖的圖片是垂直分組滾動的，你可以自定義圖片組，也可以定義圖片組中圖片的數量，滑鼠滑過指定的導航上時，相應的圖片組即可上下切換，另外，焦點圖的切換導航上有小圖示，顯得更加美觀。

線上演示        原始碼下載

6、jQuery自動輪播圖片焦點圖外掛

今天我們要繼續來分享一款非常實用的jQuery焦點圖外掛，和其他的jQuery焦點圖外掛一樣，它同樣支援多張圖片的任意跳轉切換，同時，焦點圖切換方式是水平的，而且相當流暢，因為這款jQuery焦點圖實現很簡單。

線上演示        原始碼下載

7、簡單實用的jQuery橫向圖片滾動焦點圖外掛

今天的這款jQuery焦點圖外掛看起來非常簡單，但是無論從外觀和實用價值上看都相當不錯。這款jQuery焦點圖的圖片是橫向滾動的，兩側均有左右滑動按鈕。

線上演示        原始碼下載

8、jQuery底部帶縮圖的焦點圖外掛

今天我們要介紹的這款jQuery焦點圖外掛是帶有縮圖的，我們只需點選縮圖即可切換至相應的圖片，圖片切換的時候出現淡入淡出的動畫效果。

線上演示        原始碼下載

以上的很多jQuery焦點圖動畫外掛都還是挺實用的，如果你有需要，可以下載原始碼並將它們整合到自己的頁面中去，我們將繼續為大家分享更多的前端開發資源。