鼠标经过停留时显示下面的div,鼠标不在时就只有计算机工程系

解决方案 »

  1.   

    给包含计算机工程系的那个元素注册mouseover 和 mouseout事件,mouseover时显示下面的div,mouseout时隐藏下面的div
      

  2.   


    <!doctype html>
    <html lang="en">
    <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <title> 页面名称 </title>
    <style type="text/css">
    .menu-button {
    width: 200px;
    height: 30px;
    background-color: #66f;
    position: relative;
    }
    .menu-button .menu {
    width: 200px;
    height: 300px;
    background-color: #ccf;
    position: absolute;
    left: 0;
    top: 100%;
    display: none;
    }
    .menu-button:hover .menu {
    display: block;
    }
    </style>
    </head>
    <body><div class="menu-button">
    xxxxxxxxxx
    <div class="menu">
    </div></div>
    </body>
    </html>
      

  3.   

    简单的  二级导航   可以用 css里的hover  来做