首页>>焦点图>>全屏banner 左右滚动图片(2014-03-05)

全屏banner 左右滚动图片

全屏banner 左右滚动图片
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="container">   
  2.             <div id="cbp-fwslider" class="cbp-fwslider">  
  3.                 <ul>  
  4.                     <li><a href="#"><img src="images/1.jpg" alt="img01"/></a></li>  
  5.                     <li><a href="#"><img src="images/2.jpg" alt="img02"/></a></li>  
  6.                     <li><a href="#"><img src="images/3.jpg" alt="img03"/></a></li>  
  7.                     <li><a href="#"><img src="images/4.jpg" alt="img04"/></a></li>  
  8.                     <li><a href="#"><img src="images/5.jpg" alt="img05"/></a></li>  
  9.                 </ul>  
  10.             </div>  
  11.         </div>  

 

JavaScript Code
  1. <script>  
  2.             $( function() {  
  3.                 /* 
  4.                 - how to call the plugin: 
  5.                 $( selector ).cbpFWSlider( [options] ); 
  6.                 - options: 
  7.                 { 
  8.                     // default transition speed (ms) 
  9.                     speed : 500, 
  10.                     // default transition easing 
  11.                     easing : 'ease' 
  12.                 } 
  13.                 - destroy: 
  14.                 $( selector ).cbpFWSlider( 'destroy' ); 
  15.                 */  
  16.   
  17.                 $( '#cbp-fwslider' ).cbpFWSlider();  
  18.   
  19.             } );  
  20.         </script>  

 


原文地址:http://www.freejs.net/article_jiaodiantu_283.html