zoukankan      html  css  js  c++  java
  • html导航隐藏显示

    <!DOCTYPE html>
    <html>
     <head>
      <meta charset="UTF-8">
      <title></title>
      <script src="js/jquery-1.11.3.min.js" ></script>
     </head>
      <script>
       $(function(){
        $("dd").hide();
        $("dt").click(function(){
         if($(this).next().is(":hidden"))
         {
          $(this).next().slideDown(1000);
         }else
         {
          $(this).next().slideUp(1000);
         }
        });
       });
      </script>
     <body>
      <dl>
       <dt>产品中心</dt>
        <dd>
         <div>产品</div>
         <div>产品</div>
         <div>产品</div>
        </dd>
       <dt>新闻中心</dt>
        <dd>
         <div>新闻</div>
         <div>新闻</div>
         <div>新闻</div>
        </dd>
       <dt>金钱中心</dt>
        <dd>
         <div>金钱</div>
         <div>金钱</div>
         <div>金钱</div>
        </dd>
       
      </dl>
     </body>
    </html>

  • 相关阅读:
    小白的进阶之路7
    小白的进阶之路6
    小白的进阶之路5
    小白的进阶之路4
    小白的进阶之路3
    小白的进阶之路2
    小白的进阶之路1
    02CSS布局13
    02css定位12
    02css盒子模型11
  • 原文地址:https://www.cnblogs.com/index0629/p/8600664.html
Copyright © 2011-2022 走看看