首页>>焦点图>>wan-carousel slide演示(2015-10-20)

wan-carousel slide演示

wan-carousel slide演示
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="wan-carousel wan-carousel-1" style="width: 50%; float:left;">  
  2.     <div class="carousel-list">  
  3.       <img src="../demo1.jpg" alt="img">  
  4.       <img src="../demo2.jpg" alt="img">  
  5.       <img src="../demo3.jpg" alt="img">  
  6.       <img src="../demo4.jpg" alt="img">  
  7.     </div>  
  8.   </div>  
  9.   <div class="wan-carousel wan-carousel-2" style="width: 50%; float:left;">  
  10.     <div class="carousel-list">  
  11.       <a href="#">  
  12.         <img src="../demo1.jpg" alt="img">  
  13.       </a>  
  14.       <img src="../demo2.jpg" alt="img">  
  15.     </div>  
  16.   </div>  
  17.   <div class="wan-carousel wan-carousel-3" style="width: 50%; float:left;">  
  18.     <div class="carousel-list">  
  19.       <img src="../demo2.jpg" alt="img">  
  20.       <img src="../demo3.jpg" alt="img">  
  21.       <img src="../demo4.jpg" alt="img">  
  22.     </div>  
  23.   </div>  
  24.   <div class="wan-carousel wan-carousel-4" style="width: 50%; float:left;">  
  25.     <div class="carousel-list">  
  26.       <a href="#">  
  27.         <img src="../demo1.jpg" alt="img">  
  28.       </a>  
  29.       <img src="../demo2.jpg" alt="img">  
  30.     </div>  
  31.   </div>  
  32.   <script type="text/javascript" src="js/jquery-1.11.3.js"></script>  
  33.   <script type="text/javascript" src="build/wan-carousel.js"></script>  
  34.   <script>  
  35.   $(".wan-carousel-1, .wan-carousel-2").WanCarousel();  
  36.   $(".wan-carousel-3").WanCarousel({  
  37.     interval: 8000,  
  38.     speed: 400,  
  39.   });  
  40.   $(".wan-carousel-4").WanCarousel({  
  41.     interval: 2000,  
  42.     speed: 800,  
  43.   });  
  44.   </script>  

 


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