12款經典的白富美型 jQuery 圖片輪播插件

時間 2021-01-02

標籤 javascript css html 前端 html5 java jquery ios css3 git 欄目 JQuery 简体版

原文原文鏈接

　　圖片輪播是網站中的經常使用功能，用於在有限的網頁空間內展現一組產品圖片或者照片，同時還有很是吸引人的動畫效果。本文向你們推薦12款實用的 jQuery 圖片輪播效果插件，幫助你在你的項目中加入一些效果精美的圖片輪播效果，但願這些插件可以幫助到你。javascript

Nivo Slider

首先推薦的這款插件號稱世界上最棒的圖片輪播插件，有獨立的 jQuery 插件和 WordPress 插件兩個版本。css

目前下載量已經突破 1,800,000 次！jQuery 獨立版本的插件主要有以下特點：html

✓ 16個獨特的過渡效果
✓ 簡潔和有效的標記
✓ 加載參數設置
✓ 內置方向和導航控制
✓ 壓縮版本大小隻有12KB
✓ 支持連接圖像
✓ 支持 HTML 標題
✓ 3套精美光滑的主題
✓ 在MIT許可下無償使用
✓ 支持響應式設計

插件下載效果演示前端

3D Image Slider

很是很是酷的 3D 圖片滑動效果，有五種絢麗的效果演示。html5

立體效果是基於 CSS3 實現的，請使用最新 Chrome，Firefox 和 Safari 瀏覽器瀏覽效果。java

對於不支持 CSS3 的瀏覽器提供了優雅的降級處理，這款插件還有詳細的製做教程。jquery

插件下載效果演示ios

Flexslider

FlexSlider 是一款輕量的響應式 jQuery 內容滾動插件，可以幫助你在項目輕鬆的建立漂亮的內容滾動效果。css3

這款插件也是 2011 年度最佳 jQuery 插件，今年被 WooThemes 收購併發佈了2.0版本，所以繼續入選 2012 年度榜單。git

主要特點

✓ 簡單的，語義化的標籤；
✓ 支持全部主流的瀏覽器；
✓ 水平/垂直滑動和淡入淡出動畫；
✓ 支持多個滑塊，回調 API，以及更多；
✓ 觸摸滑動支持硬件加速；
✓ 可以自定義導航選項。
✓ 兼容最新版本的 jQuery。

插件下載效果演示

Elastislide

Elastislide 是一款很是優秀的響應式 jQuery 幻燈片插件，集成了 Touchwipe 插件以支持觸屏設備。

提供了四種效果

✓ 水平圖片傳送帶
✓ 垂直圖片傳送帶
✓ 固定在屏幕底部
✓ 縮略圖形式預覽

這款插件也有詳細的製做教程，很是詳細，能夠學習到插件的製做方法。

插件下載效果演示

3D Gallery

特別推薦！精緻的立體圖片切換效果，特別適合企業產品展現，可當即用於實際項目中。

支持導航和自動播放功能，基於 CSS3 實現，推薦使用最新的 Chrome，Firefox 和 Safari 瀏覽器瀏覽效果。

插件下載效果演示

Image Transitions

基於 jQuery 和 CSS3 動畫實現的圖片過渡效果。

共有Flip、Rotation、Multi-flip、Cube、Unfold等6種效果。

這款插件有詳細的製做教程能夠參考學習。

插件下載效果演示

Slidesjs

Slides 是一個很是簡潔的 jQuery 圖片輪播插件，其特色是自動循環播放、圖片預加載以及自動分頁功能。

使用示例

下載插件效果演示

Galleria

這是一個響應式的 JavaScript 相冊插件，目的是讓製做專業相冊功能變得更加簡單。

Galleria 支持縮略圖導航、全屏瀏覽和自動播放功能，支持 iPhone，iPad Touch 等移動觸屏設備。

下載插件效果演示

AnythingSlider

AnythingSlider 由CSS-Tricks 的Chris Coyier 設計，功能齊全，效果精美，應用十分普遍。

主要特點

✓ 簡單的，語義化的標籤；
✓ 水平/垂直滑動和淡入淡出動畫；
✓ 主題能夠適用於單個滑塊；
✓ 同一個頁面能夠顯示多個滑動模塊；
✓ 提供了豐富的自定義參數選項。
✓ 支持全部主流的瀏覽器；

下載插件效果演示

WOW Slider

這是另一款效果精美的響應式圖片輪播插件，有衆多專業的模板。

提供了 Rotate,Blur, Flip, Blast, Fly, Blinds, Squares, Slices, Basic, Fade 等精美的輪播效果。

下載插件效果演示

An HTML5 Slideshow

基於 HTML5 Canvas 和 jQuery 製做的圖片幻燈片效果，有詳細的製做教程能夠學習。

詳細的製做教程和實現思路參考這裏，An HTML5 Slideshow With Canvas & jQuery。

下載插件效果演示

Awkward Showcase

提供常見的圖片輪播效果，能夠先後切換，也能夠經過頁碼導航，可以在一頁上顯示也能夠幻燈片形式顯示。

效果演示

下載插件效果演示

您可能感興趣的相關文章

本文連接：精心推薦12款很是實用的 jQuery 圖片輪播插件

編譯來源：夢想天空 ◆ 關注前端開發技術 ◆ 分享網頁設計資源

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。