首页>>导航菜单>>Trunk.js jQuery响应式导航菜单插件(2017-09-27)

Trunk.js jQuery响应式导航菜单插件

Trunk.js jQuery响应式导航菜单插件

 

XML/HTML Code
  1. <div class="container">  
  2.   
  3.     <header class="slide">     <!-- Add "slideRight" class to items that move right when viewing Nav Drawer  -->  
  4.         <ul id="navToggle" class="burger slide">    <!--    Add "slideRight" class to items that move right when viewing Nav Drawer  -->  
  5.             <li></li><li></li><li></li>  
  6.         </ul>  
  7.         <h1 class="logo"><a href="http://www.freejs.net" title="freejs首页"><img src="../../images/logo.png" height="47" width="500" alt="freejs首页" /></a></h1>  
  8.     </header>  
  9.   
  10.     <nav class="slide">  
  11.         <ul>  
  12.             <li><a href="#" class="active">HOME</a></li>  
  13.             <li><a href="#">LINK TWO</a></li>  
  14.             <li><a href="#">LINK THREE</a></li>  
  15.             <li><a href="#">LINK FOUR</a></li>  
  16.             <li><a href="#">LINK FIVE</a></li>  
  17.             <li><a href="#">LINK SIX</a></li>  
  18.             <li><a href="#">LINK SEVEN</a></li>  
  19.         </ul>  
  20.     </nav>  
  21.       
  22.     <div class="content slide">     <!--    Add "slideRight" class to items that move right when viewing Nav Drawer  -->  
  23.         <ul class="responsive">  
  24.             <li class="header-section">  
  25.                 <p class="placefiller">HEADER</p>  
  26.             </li>  
  27.             <li class="body-section">  
  28.                 <p class="placefiller">BODY  
  29.                   
  30.                 </p>  
  31.             </li>  
  32.             <li class="footer-section">  
  33.                 <p class="placefiller">FOOTER</p>  
  34.             </li>  
  35.         </ul>  
  36.     </div>  
  37.       
  38. </div>  

 


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