首页>>焦点图>>简单的全屏slide支持链接(2016-06-04)

简单的全屏slide支持链接

简单的全屏slide支持链接
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

XML/HTML Code
  1. <div class="banner_box">  
  2.       <div class="index-banner" id="index-banner">  
  3.     <div class="index-banner-scroll">  
  4.           <ul>  
  5.         <li> <a href="#" target="_blank" style="cursor: pointer;"> <img src="http://freejs.net/demo/561/banner01.jpg"> </a> </li>  
  6.         <li> <a href="#" target="_blank" style="cursor: pointer;"> <img src="http://freejs.net/demo/561/banner03.jpg"> </a> </li>  
  7.       </ul>  
  8.         </div>  
  9.     <div class="control"><span class="" style="opacity: 1;"></span><span style="opacity: 1;"></span></div>  
  10.   </div>  
  11.     </div>  
  12. <div class="btn-group"> <span class="prev">Prev</span> <span class="next">Next</span> </div>  

 

JavaScript Code
  1. <script>  
  2.        $(function() {  
  3.            $(".banner_box").slider({  
  4.                containerEl: $(".index-banner-scroll"),  
  5.                silderContainerEl: $("#index-banner ul"),  
  6.                itemEl: $("#index-banner ul li"),  
  7.                btnEl: $('.control span'),  
  8.                btnContainerEl: $('.control'),  
  9.                prev: $(".prev"),  
  10.                next: $(".next"),  
  11.                index: 0,  
  12.                resizeable: true,  
  13.                showButton: true  
  14.            });  
  15.        });  
  16.    </script>  

 


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