js網站輪播圖怎麽做如何做？雞哥教你簡單制作效果炫酷
日了狗啦，剛剛雞哥辛苦碼了那麽多字全丟了又要重新寫，這是第二遍寫了...
今天雞哥給小白寫個不需要寫js原生代碼，只需要幾個插件和一段通俗易懂得jquery代碼就能搞定的輪播圖，當然js原生代碼寫著也不算很繁瑣，但是有些浪費時間，更何況很多人並不會用js直接寫包括雞哥，當年在學校還是研究過一段時間js的，當時還獨自寫了一個輪播圖俘獲了多少同班妹子的芳心，不過現在是基本廢了，這東西要常寫，不然忘的很快。
唉，本來還有妹子等著雞哥呢，我這一大意文章丟了，重新寫的話估計來不及了，先打個電話讓妹子回家吧~~ 好了切入主題！
本次教程的原理就是用一個大神寫好的插件，裏邊包含了很多封裝好的js函數供我們使用，我們只需引入這個插件和jquery庫配合，然後寫出規定的html結構，最後再插一段通俗易懂的jquery代碼就大功告成了~~
大家先百度一下“大話主席” 第一個就是點進去點擊下載頁面
下載之後是一個本地的網站其實和線上是一樣的下載不下載都一樣，打開之後點擊基礎效果，如果想下載擴展效果的話是要付費的，反正也不貴19塊錢，就當給作者得辛苦錢（雞哥是不是要想這貨要點廣告費啊~~~哈哈哈）
雞哥截圖沒截完，其實下邊還有很多效果，右側紅框框住的是輪播效果的屬性選擇，可以生成一段jquery代碼（橙色部分代碼），就是剛才所說的那段通俗易懂得代碼。這段代碼在最後是要用到的，我在後邊會講到。
好了，大話主席的插件簡單的介紹完了，下邊給大家列一下需要得插件：
1：jquery1.42.min.js / jquery庫 知道點js的人都懂得
2：jquery.SuperSlide.2.1.1.js / 這個就是剛剛介紹得大話主席的插件
這倆插件雞哥會在大家夥看完文章後在結尾附上下載鏈接，雞哥打包好的。
下邊雞哥介紹下這倆文件如何引要放在哪裏先看個截圖：
如截圖，在body結束標簽後邊引入我們的這倆文件，當然你的路徑可能跟我的不一樣。
特別註意一下：引入的順序一定要先引入jquery插件然後引入大話主席插件不然沒得效果~~~
知道怎麽引入之後大家再看看html的結構怎麽寫，必須要按照這個結構，不然也沒得效果，見下方代碼結構。
<div class="box"> / 此標紅類名後邊會用到 留意 <div class="hd"> <ul><li>1</li><li>2</li><li>3</li></ul> </div> <div class="bd"> <ul><li>1.jpg</li><li>2.jpg</li><li>3.jpg</li></ul> </div> </div>
如上述代碼：一個大的div包住倆小div，大div類名就是標紅地方可以任意起，倆小div是固定的類名，hd就是head的縮寫，就是輪播圖中的1234之類的按鈕。bd縮寫就是body，就是輪播圖啦。
好了，現在已經基本差不多了就差一個生成的剛剛講過的那個橙色部分代碼了，按照自己想要的效果生成一個代碼，然後復制到你引入大話主席代碼的下邊就ok了，見下方代碼：
jQuery(".box").slide({mainCell:".bd ul",effect:"fold",autoPlay:true,interTime:7000,delayTime:1000});
標紅的地方填的就是剛剛所講的大div的類名，特別註意前邊有個點。
到現在已經基本成了，但是大家還不要忘了給你的html加上css樣式喲，怎麽樣是不是很簡單~~~
好了文章到這終於寫完了，第二次啊.....可能寫的有些粗糙，畢竟現在已經淩晨一點多了，不知各位看官覺得寫的怎麽樣，哪裏沒寫明白請在下方評論中寫出，這樣及提升了你也提升了我。
感謝瀏覽啊
原文鏈接：js網站輪播圖怎麽做如何做？雞哥教你簡單制作效果炫酷
js網站輪播圖怎麽做如何做？雞哥教你簡單制作效果炫酷