首页>>导航菜单>>jquery仿腾讯云下拉导航(2014-07-23)

jquery仿腾讯云下拉导航

 适合下拉菜单分类的导航

jquery仿腾讯云下拉导航
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="head-v3">  
  2.     <div class="navigation-up">  
  3.         <div class="navigation-inner">  
  4.             <div class="navigation-v3">  
  5.                 <ul>  
  6.                     <li class="nav-up-selected-inpage" _t_nav="home">  
  7.                         <h2>  
  8.                             <a href="#">首页</a>  
  9.                         </h2>  
  10.                     </li>  
  11.                     <li class="" _t_nav="product">  
  12.                         <h2>  
  13.                             <a href="#">云产品</a>  
  14.                         </h2>  
  15.                     </li>  
  16.                     <li class="" _t_nav="wechat">  
  17.                         <h2>  
  18.                             <a href="#">微信建站</a>  
  19.                         </h2>  
  20.                     </li>  
  21.                     <li class="" _t_nav="solution">  
  22.                         <h2>  
  23.                             <a href="#">行业解决方案</a>  
  24.                         </h2>  
  25.                     </li>  
  26.                     <li class="" _t_nav="cooperate">  
  27.                         <h2>  
  28.                             <a href="#">合作伙伴</a>  
  29.                         </h2>  
  30.                     </li>  
  31.                     <li _t_nav="support">  
  32.                         <h2>  
  33.                             <a href="#">帮助与支持</a>  
  34.                         </h2>  
  35.                     </li>  
  36.                 </ul>  
  37.             </div>  
  38.         </div>  
  39.     </div>  
  40.     <div class="navigation-down">  
  41.         <div id="product" class="nav-down-menu menu-1" style="display: none;" _t_nav="product">  
  42.             <div class="navigation-down-inner">  
  43.                 <dl style="margin-left: 100px;">  
  44.                     <dt>计算机与网络</dt>  
  45.                     <dd>  
  46.                         <a hotrep="hp.header.product.compute1" href="#">云服务器</a>  
  47.                     </dd>  
  48.                     <dd>  
  49.                         <a hotrep="hp.header.product.compute2" href="#">弹性Web引擎</a>  
  50.                     </dd>  
  51.                     <dd>  
  52.                         <a hotrep="hp.header.product.compute3" href="#">负载均衡</a>  
  53.                     </dd>  
  54.                 </dl>  
  55.                 <dl>  
  56.                     <dt>存储与CDN</dt>  
  57.                     <dd>  
  58.                         <a hotrep="hp.header.product.storage1" href="#">云数据库</a>  
  59.                     </dd>  
  60.                     <dd>  
  61.                         <a hotrep="hp.header.product.storage2" href="#">NoSQL高速存储</a>  
  62.                     </dd>  
  63.                     <dd>  
  64.                         <a hotrep="hp.header.product.storage4" href="#">对象存储服务(beta)</a>  
  65.                     </dd>  
  66.                     <dd>  
  67.                         <a hotrep="hp.header.product.storage3" href="#">CDN</a>  
  68.                     </dd>  
  69.                 </dl>  
  70.                 <dl>  
  71.                     <dt>监控与安全</dt>  
  72.                     <dd>  
  73.                         <a hotrep="hp.header.product.monitoring1" href="#">云监控</a>  
  74.                     </dd>  
  75.                     <dd>  
  76.                         <a hotrep="hp.header.product.monitoring2" href="#">云安全</a>  
  77.                     </dd>  
  78.                     <dd>  
  79.                         <a hotrep="hp.header.product.monitoring3" href="#">云拨测</a>  
  80.                     </dd>  
  81.                 </dl>  
  82.                 <dl>  
  83.                     <dt>数据分析</dt>  
  84.                     <dd>  
  85.                         <a hotrep="hp.header.product.analysis1" href="#">腾讯云分析</a>  
  86.                     </dd>  
  87.                     <dd>  
  88.                         <a hotrep="hp.header.product.analysis2" href="#">关键因子</a>  
  89.                     </dd>  
  90.                 </dl>  
  91.                 <dl>  
  92.                     <dt>开发者工具</dt>  
  93.                     <dd>  
  94.                         <a hotrep="hp.header.product.devtool1" href="#">移动加速</a>  
  95.                     </dd>  
  96.                     <dd>  
  97.                         <a hotrep="hp.header.product.devtool2" href="#">应用加固</a>  
  98.                     </dd>  
  99.                     <dd>  
  100.                         <a hotrep="hp.header.product.devtool3" href="#">信鸽推送</a>  
  101.                     </dd>  
  102.                 </dl>  
  103.                 <dl>  
  104.                     <dt>开发者服务</dt>  
  105.                     <dd>  
  106.                         <a hotrep="hp.header.product.service1" href="#">安全认证服务</a>  
  107.                     </dd>  
  108.                     <dd>  
  109.                         <a hotrep="hp.header.product.service2" href="#">域名备案</a>  
  110.                     </dd>  
  111.                 </dl>  
  112.             </div>  
  113.         </div>  
  114.         <div id="solution" class="nav-down-menu menu-3 menu-1" style="display: none;" _t_nav="solution">  
  115.             <div class="navigation-down-inner">  
  116.                 <dl style="margin-left: 380px;">  
  117.                     <dd>  
  118.                         <a class="link" hotrep="hp.header.solution.1" href="#">微信</a>  
  119.                     </dd>  
  120.                 </dl>  
  121.                 <dl>  
  122.                     <dd>  
  123.                         <a class="link" hotrep="hp.header.solution.2" href="#">游戏</a>  
  124.                     </dd>  
  125.                 </dl>  
  126.                 <dl>  
  127.                     <dd>  
  128.                         <a class="link" hotrep="hp.header.solution.3" href="#">移动应用</a>  
  129.                     </dd>  
  130.                 </dl>  
  131.             </div>  
  132.         </div>  
  133.         <div id="support" class="nav-down-menu menu-3 menu-1" style="display: none;" _t_nav="support">  
  134.             <div class="navigation-down-inner">  
  135.                 <dl style="margin-left: 610px;">  
  136.                     <dd>  
  137.                         <a class="link" hotrep="hp.header.support.1" href="#">资料库</a>  
  138.                     </dd>  
  139.                 </dl>  
  140.                 <dl>  
  141.                     <dd>  
  142.                         <a class="link" hotrep="hp.header.support.2" href="#">论坛</a>  
  143.                     </dd>  
  144.                 </dl>  
  145.                 <dl>  
  146.                     <dd>  
  147.                         <a class="link" hotrep="hp.header.support.3" href="#">亿元扶持</a>  
  148.                     </dd>  
  149.                 </dl>  
  150.             </div>  
  151.         </div>  
  152.         <div id="cooperate" class="nav-down-menu menu-3 menu-1" style="display: none;" _t_nav="cooperate">  
  153.             <div class="navigation-down-inner">  
  154.                 <dl style="margin-left: 480px;">  
  155.                     <dd>  
  156.                         <a hotrep="hp.header.partner.1" href="#">代理商</a>  
  157.                     </dd>  
  158.                 </dl>  
  159.                 <dl>  
  160.                     <dd>  
  161.                         <a hotrep="hp.header.partner.2" href="#">微信服务商</a>  
  162.                     </dd>  
  163.                 </dl>  
  164.                 <dl>  
  165.                     <dd>  
  166.                         <a hotrep="hp.header.partner.3" href="#">创投机构</a>  
  167.                     </dd>  
  168.                 </dl>  
  169.             </div>  
  170.         </div>  
  171.     </div>  
  172. </div>  

 


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