|
圖片畫廊 今天分享一個(gè)自己實(shí)現(xiàn)的jQuery 圖片畫廊插件。 看一下效果圖：
點(diǎn)擊圖片時(shí)：
在線演示地址：http://www./photoGallery/photoGallery.html 使用 使用也是很簡單,，代碼如下：  <div id="photoGallery-container"><img class="photoGallery" data-src="img/1-1.jpg" src="img/1-1.jpg" data-id="pic_1" data-desc="圖片1"><img class="photoGallery" data-src="img/1-2.jpg" src="img/1-2.jpg" data-id="pic_2" data-desc="圖片2"><img class="photoGallery" data-src="img/1-3.jpg" src="img/1-3.jpg" data-id="pic_3" data-desc="圖片3"><img class="photoGallery" data-src="img/1-4.jpg" src="img/1-4.jpg" data-id="pic_4" data-desc="圖片4"><img class="photoGallery" data-src="img/1-5.jpg" src="img/1-5.jpg" data-id="pic_5" data-desc="圖片5"><img class="photoGallery" data-src="img/1-6.jpg" src="img/1-6.jpg" data-id="pic_6" data-desc="圖片6"><img class="photoGallery" data-src="img/1-7.jpg" src="img/1-7.jpg" data-id="pic_7" data-desc="圖片7"><img class="photoGallery" data-src="img/1-8.jpg" src="img/1-8.jpg" data-id="pic_8" data-desc="圖片8"></div> 其中id為photoGallery-container的容器內(nèi)存放自己想要展示的圖片組,，每個(gè)img都有一個(gè).photoGallery的類和三個(gè)自定義的data-屬性，分別是： .photoGallery ： 定義縮略圖的樣式,，標(biāo)識此圖片是展示圖片之一 data-src : 定義縮略圖對應(yīng)大圖的路徑 data-id : 定義圖片的id data-desc : 定義圖片的描述 所以,，這要滿足以上四個(gè)很簡單的條件，那么就能很輕松的使用了（PS：IE6不兼容） github下載地址：https://github.com/JR93/photoGallery |
|
|
