23-8 輪播圖

一、backstretch 套件

1. backstretch 一個簡單的jQuery插件，它允許你動態調整大小，幻燈片功能的背景圖像添加到任何頁面或元素( MIT license.)
2. 網址：http://srobbin.com/jquery-plugins/backstretch/
3. 範例：

二、使用方法

1. 引入

   
       <script src="<{xoImgUrl}>js/jquery.backstretch.min.js"></script>

    

2. 調用插件

   
       <script type="text/javascript">
         $(document).ready(function(){
           $('header').backstretch([
              "<{xoImgUrl}>img/slider1.jpg"
            , "<{xoImgUrl}>img/slider2.jpg"
            , "<{xoImgUrl}>img/slider3.jpg"
            ], {duration: 5000, fade: 750});
         });
       </script>