[jQuery Plugin] 背景幻燈片- VEGAS

最近因為需求需要找背景幻燈片，找到這個很功能完整而且很漂亮的 plugin，有需求的可以試試這個 Vegas Background SlideShow。

簡單引入就可以使用了。

view plaincopy to clipboardprint

1. <link rel="stylesheet" href="/js/vegas/vegas.min.css">  
2. <script src="/js/vegas/vegas.min.js"></script>  

view plaincopy to clipboardprint

1. $("#example").vegas({   
2.     slides: [   
3.         { src: "/img/slide1.jpg" },   
4.         { src: "/img/slide2.jpg" },   
5.         { src: "/img/slide3.jpg" },   
6.         { src: "/img/slide4.jpg" }   
7.     ]   
8. });  

預設轉場是淡入淡出，要自訂轉場效果也可以參考文件選擇。

view plaincopy to clipboardprint

1. $elmt.vegas({   
2.     slides: [   
3.         { src: '/img/slide1.jpg' },   
4.         { src: '/img/slide2.jpg' },   
5.         { src: '/img/slide3.jpg' }   
6.     ],   
7.     transition: 'fade'  
8. });  

也可以個別設定。

view plaincopy to clipboardprint

1. $elmt.vegas({   
2.     slides: [   
3.         { src: '/img/slide1.jpg' },   
4.         { src: '/img/slide2.jpg' },   
5.         { src: '/img/slide3.jpg' }   
6.     ],   
7.     transition: [ 'fade', 'zoomOut', 'swirlLeft' ]   
8. });  

其他設定可以參考這邊的文件。