zoukankan      html  css  js  c++  java
  • jquery书写的下拉菜单

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
        <script src="jQuery/jquery-1.7.2.min.js"></script>
        <style type="text/css">
            *
            {
                margin:0px;
                height:0px;
            }
            .top_list
            {
                top:20px;
                height:40px;
                100px;
                position:relative;
                margin-left:10px;
                float:left;
                background-color:red;
                overflow:hidden;
            }
            .down_list
            {
                top:40px;
                height:200px;
                100px;
                position:relative;
                background-color:green;
            }
        </style>
            <script type="text/javascript">
                $(document).ready(function () {
                    $(".top_list").hover(function () {
                        $(this).stop().animate({ height: "240" }, 500);
                    },
                    function () {
                        $(this).stop().animate({ height: "40" }, 500);
                    });
                });
        </script>
    </head>
    <body>
        <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
          <div class="top_list">
            <div class="down_list"></div>
        </div>
    
    </body>
    

      

  • 相关阅读:
    msyql多个or,and,
    mysql中 where in 用法详解
    history.back(-1)和history.go(-1)的区别
    经典 mysql 28道题
    企业案例(二):增量恢复案例
    企业案例(一):由于mysql sleep线程过多小故障
    mysql数据库恢复
    binlog介绍
    mysql 数据库备份
    docker入门与实践
  • 原文地址:https://www.cnblogs.com/123lucy/p/5763840.html
Copyright © 2011-2022 走看看