伸手党 默默地求段代码...

lsza

chinaz.com 上面的那个banner挺好玩的，有没有mjj有现成的代码？

打开的样子
QQ截图20170320222140.png (520.03 KB, 下载次数: 0)

2017-3-20 22:20 上传

点击文件名下载附件

一会自己缩回去
QQ截图20170320222147.png (356.55 KB, 下载次数: 0)

2017-3-20 22:20 上传

点击文件名下载附件

yanghao

1. <script src="http://img.chinaz.com/templates/2015style/js/jquery-1.10.2.min.js" type="text/javascript"></script>
   
2. <script src="http://img.chinaz.com/templates/15years/topic15/topic15.js"></script>
   
3. 
   
4. <style>
   
5. .large-topic15{ background: url(http://img.chinaz.com/templates/15years/topic15/img/1920x500.jpg) top center no-repeat; height: 500px;}
   
6. .large-img,.small-img{ width: 100%; height: 100%;display:block}
   
7. .large-cont{ width: 1000px; margin: 0 auto; height: 5px; position: relative; }
   
8. .large-cont .lag-cloes{ width: 60px; height: 60px; display: block; position: absolute; top: -474px; right: 3px; cursor:pointer; }
   
9. 
   
10. .large-topic15,.small-topic15{ width: 100%; position: relative; display:none;}
    
11. 
    
12. .small-topic15{background: url(http://img.chinaz.com/templates/15years/topic15/img/1920x70.jpg) top center no-repeat;height: 70px;}
    
13. .small-cont{ width: 1000px; margin: 0 auto; height: 2px; position: relative; }
    
14. .small-cont .small-cloes{ width: 50px; height: 28px; display: block; position: absolute; top: -65px; right: 40px; cursor:pointer; }
    
15. </style>
    
16. <div id="topic15">
    
17.     <div class="small-topic15">
    
18.         <a  target="_blank" class="small-img"></a>
    
19.         <div class="small-cont">
    
20.             <span class="small-cloes"></span>
    
21.         </div>
    
22.     </div>
    
23.     <div class="large-topic15">
    
24.         <a  target="_blank"  class="large-img"></a>
    
25.             <div class="large-cont">
    
26.                 <span class="lag-cloes"></span>
    
27.             </div>
    
28.     </div>
    
29. </div>

复制代码

拿去