軟件介紹

SuperSlide特別版是一款可以幫助用戶制作出各種漂亮酷炫網頁的前端開發插件，這款軟件是基于jQuery插件所開發出來的。我們不僅可以使用SuperSlide2來解決網頁的特效展示問題，同時還可以通過這款軟件來網頁前端來完成各種動態特效的制作，功能非常強大。

SuperSlide特別版軟件簡介

SuperSlide擴展效果插件是專為使用jQuery進行jsp網頁開發的用戶制作的效果插件，擁有標簽、書簽、焦點圖、幻燈片、圖片滾動、文字滾動、導航、手風琴等一些基礎的效果，基本上每個開發人員都會使用到這些效果，而且不會出現代碼沖突，維護起來也很簡單方便，是您制作網頁的必備神器。

SuperSlide致力于解決網站大部分特效展示問題，使網站代碼規范整潔，方便維護更新。網站上常用的“焦點圖/幻燈片”“Tab標簽切換”“圖片滾動”“無縫滾動”等只需要一個SuperSlide即可解決！從此無需網上苦苦尋覓特效，無需加載n個插件，無需害怕代碼沖突，你需要的只是一個SuperSlide！還可以多個SuperSlide組合創造更多效果哦~

SuperSlide特別版軟件功能

效果類型，可選"slide"||"menu"，引入type:"menu"專門處理菜單/導航效果

默認是否執行效果（第一次運行是否執行效果）常用于導航/菜單

鼠標移出容器，是否返回默認狀態，常用于導航/菜單

內容切換加載，暫時只支持圖片，必須配合后臺程序使用。當為圖片的時候switchLoad為圖片實際路徑的屬性名稱

每次切換效果開始時執行函數，用于處理特殊情況或創建更多效果。用法 satrtFun:function(i,c){ }； 其中i為當前分頁，c為總頁數

增加傳遞參數毫秒，titCell觸發時間，默認150毫秒延遲，以防重復執行效果。若為0即鼠標移過titCell立刻執行效果

前/后按鈕是否繼續循環，若為false則當翻動到最前/后頁時，前/后按鈕點擊無效，同時增加prevStop/nextStop類名控制樣色

毫秒；自動運行間隔。當effect為無縫滾動(topMarquee/leftMarquee)時，相當于運行速度。

軟件特色

1、SuperSlide可以幫助用戶快速的設計網站展示的特效

2、支持設計標簽切換效果

3、支持切換幻燈片設置

4、可以設計圖片滾動方式，向上、向左

5、可以設計網站圖片無縫滾動，一張一張的展示循環播放

6、可以設置文字的滾動方式，就像LED字幕一樣

SuperSlide特別版使用說明

1、引用jQuery.js 和jquery.SuperSlide.js

因為這個插件是基于jQuery的插件，所以前提必須先引用jQuery，再引用。

2、編寫HTML

以下是默認的HTMl結構，分別是 ".hd" 里面包含ul， ".bd" 里面包含ul

3、編寫CSS，為HTML賦予樣色

認真檢查您的css，保證兼容大部分瀏覽器前提下再調用插件

4、調用插件方法

在本例中，請在 “.slideTxtBox” div結束后立刻調用插件，這樣會得到最好的效果，避免整個頁面加載后再調用；因為是默認HTML結構，所以參數都為默認值，不用填寫titCell、mainCell等。

5、效果如下

SuperSlide特別版常見問題

superslide遇到jQuery(…).slide is not a function解決辦法？

很多新手使用superslide的時候會遇到“Uncaught TypeError: jQuery(…).slide is not a function”的提示，導致插件無法運行。

這種情況，請仔細檢查你的頁面代碼，可以在瀏覽器右擊查看“網頁源代碼”，然后搜索“jquery”關鍵詞，看看你頁面是不是引用了多個“jquery.js”，如果是那么只需保留一個jquery.js（通常是保留版本最新的），放在其它js前面即可。

這種情況通常是引用了多個jquery插件，每個插件都引用一個jquery.js，其實是多余的，只需保留一個即可。

如下面錯誤示范：

正確示范（保留一個最新版本，放在其它js前面）

superslide支持jquery哪些版本？

目前jQuery有三個大版本：

1.x：兼容ie678,使用最為廣泛的，官方只做BUG維護，功能不再新增。因此一般項目來說，使用1.x版本就可以了，最終版本：1.12.4 (2016年5月20日)

2.x：不兼容ie678，很少有人使用，官方只做BUG維護，功能不再新增。如果不考慮兼容低版本的瀏覽器可以使用2.x，最終版本：2.2.4 (2016年5月20日)

3.x：不兼容ie678，只支持最新的瀏覽器。除非特殊要求，一般不會使用3.x版本的，很多老的jQuery插件不支持這個版本。目前該版本是官方主要更新維護的版本。

superslide均支持上述所有版本，最低版本為1.4.2。可以根據你實際項目來選擇那個jq版本，如果需要兼容ie678，則只能使用1.x版本的，如果不需兼容則可以大膽使用3.x的。

導航下拉菜單被遮住或顯示不全問題所在和解決辦法？

導航下拉菜單被banner遮住/顯示不全，這種問題是老生常談了，經常有新手會問，有些人做了2、3年的還會經常犯錯，而且好多人還以為是js問題，其實這是基本的css知識。我覺得還是有必要寫一遍文章解釋給新手們。

一、導航下拉菜單被遮住，那是因為層疊關系錯誤

我們必須理解層疊關系滿足的2個條件：

1、必須是同級；

2、二者分別設定了position:relative 或 absolute 或 fixed；

這時候通過設置z-index才有效

SuperSlide滾動的遮罩層寬/高怎么計算的？如何設置具體一個值？

當我們使用滾動效果，例如：left、leftLoop、top、topLoop、leftMarquee、topMarquee等的時候，SuperSlide會自動設置一個“遮罩層（tempWrap）”來限制可視范圍，超出范圍的將會被隱藏起來。

可視范圍取決于 vis 參數和一個滾動元素的寬高，例如：

參數vis：3，effect：left；滾動元素為li。即li左滾動，可視范圍為3個li寬度。

公式： tempWrap寬度 = li寬度 * vis = （li的width + li的padding + li的margin）*3

這樣做法是為了保證效果的正確顯示，而不會出現半個li的情況。

但是，有時候客觀原因使我們必須設置具體的某一個值，而不是程序計算出來的結果，這時候我們可以用css來強制設置tempWrap的寬高。