首页>>导航菜单>>jQuery右侧弹出全屏覆盖菜单(2014-05-07)

jQuery右侧弹出全屏覆盖菜单

jQuery右侧弹出全屏覆盖菜单
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <!-- Container -->  
  2. <div class="container">  
  3.     <!-- section with buttons-->          
  4.     <section>  
  5.   
  6.         <p><button id="trigger-overlay" type="button">鼠标点击或者按键盘M查看效果</button></p>  
  7.     </section>  
  8.     <!-- section with buttons end-->      
  9.       
  10. </div>  
  11. <!-- Container end -->  
  12.   
  13.   
  14. <div class="overlay overlay-slidedown">  
  15.     <button type="button" class="overlay-close">Close</button>  
  16.       
  17.     <nav>  
  18.         <ul>  
  19.             <li><a href="#">Home</a></li>  
  20.             <li><a href="#">What we do?</a></li>  
  21.             <li><a href="#">Our clients</a></li>  
  22.             <li><a href="#">About us</a></li>  
  23.             <li><a href="#">Contact us</a></li>  
  24.         </ul>  
  25.     </nav>  
  26.     <div class="your_blocks">  
  27.     <div class="your_block">  
  28.     <a href="#">  
  29.                                                   <img src="img/intro.jpg" class="block_attachment" alt="">   
  30.                                                             <span>  
  31.         Here you can add your awesome information, ADS or recent/popular news from your site.  
  32.     </span>                                                         </a>  
  33.     </div>  
  34.     </div>  
  35.       
  36. </div>  

 


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