插件描述：該插件基于jquery開發，現階段很多PC網站都需要用到輪播圖切換的效果

全屏輪播圖

該插件基于jquery開發，現階段很多PC網站都需要用到輪播圖切換的效果，很多時候要在頁面中復用輪播圖，而且對于PC用戶而言，IE8+用戶居多，需要做一個兼容該用戶群體的全屏輪播圖，同時也可以通過參數設置來把該幻燈片設置為非全屏復用多個位置。這時候該插件便應運而生。可以通過簡單的調用及樣式來對其進行調用，從而完成快速開發的過程。該模塊并非只能是輪播圖，輪播圖條目區域可以放上文字列表、圖片等任意內容，這塊在于你自己選擇。接下來對該插件進行一個

方法調用

現在對方法調用進行一個簡單的解析，后面再就函數進行具體的解析。

html

這里是文本存放位置這里是文本存放位置

js//?默認

$('.slide-box-demo').setSlide()

參數解析參數類型說明示例值

$(this)DOM當前輪播圖($('.slide-box'))外層的包裹的DOM節點，可自定義標簽，Dom節點操作沿襲jquery的Dom節點操作。詳見demo$("#demo").setSlide()

isBlockboolean(非必填)定義幻燈片是否為塊狀展示該幻燈片。默認為falsetrue

fullScreenwboolean(非必填)寬度完全全屏，輪播圖寬度為整個屏幕寬度。注意：當設置該參數為true時，slideLiw參數無效。默認為falsetrue

fullScreenhboolean(非必填)高度完全全屏，輪播圖高度為整個屏幕高度。注意：當設置該參數為true時，slideLih參數無效。默認為falsetrue

switchingSpeednumber(非必填)定義輪播圖切換速度的毫秒數。如若為空，默認自動播放時間為600毫秒800

slideTimenumber(非必填)定義輪播圖自動播放的毫秒數，只有開啟autoPlay屬性時有效。如若為空，默認自動播放時間為3000毫秒2000

autoPlayboolean(非必填)是否自動切換，默認為falsetrue

prevElDOM(非必填)點擊輪播圖切換到上一張，可自定義標簽，Dom節點操作沿襲jquery的Dom節點操作，默認為$('#slide-button-prev')。注意：如若使用默認標簽，id只能單次調用。如果第一張操作時候便跳到最后一張。默認上一頁樣式：

nextElDOM(非必填)點擊輪播圖切換到下一張，可自定義標簽，Dom節點操作沿襲jquery的Dom節點操作，默認為$('#slide-button-next')。注意：如若使用默認標簽，id只能單次調用。如果最后一張操作時候便跳到第一張。默認下一頁樣式：

paginationboolean(非必填)是否使用分頁導航，只有開啟autoPlay屬性時有效。默認為falsetrue

pagingTriggerstring(非必填)分頁導航指示器的觸發事件，默認為click'hover'

slideLiwnumber(非必填)設定輪播容器寬度，默認單位為px，無需加單位。默認為12001000

slideLihnumber(非必填)設定輪播容器高度，默認單位為px，無需加單位。默認為600500

fnObject(非必填) 回調函數，可以在當輪播圖切換時，拿到當前輪播圖的索引值并在該時刻進行回調的操作。與一般函數寫法相同，索引值可傳可不傳。function(index) {} 或 function() {}

demo演示

對于上面所做的解析，如果還有不明白的話，不用擔心，就上面的參數提供了demo進行解析，讓你快速開發你想要的輪播圖。下面為相關demo的地址：默認調用01-default

上下頁切換調用02-navigation.html

分頁調用03-pagination.html

自動播放04-autoplay.html

自定義寬高05-widthAndheightSetting.html

塊狀展示06-block-display.html

寬高完全全屏07-fullscreen.html

回調函數08-callback.html

總結

以上是生活随笔為你收集整理的html中轮换图片插件,jQuery轮播图插件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。