1、给鼠标经过的DIV添加一个类 ，类名为submeau；如下图：
2、给显示或者隐藏的DIV，添加一个ID，ID名为:id="oa_submeau"，如下图：
3、将以下的JQUERY代码放在整个网页的最底部，用于控制鼠标经过显示DIV，离开隐藏DIV。
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$("#oa_submeau").hide()
$(".submeau").hover(function () {
$("#oa_submeau").show()
}, function () {
$("#oa_submeau").hide()
})
// 鼠标移动到list的div上的时候list div不会被隐藏
$("#oa_submeau").hover(function () {
$("#oa_submeau").show()
}, function () {
$("#oa_submeau").hide()
})
</script>，这样就可以实现鼠标经过某个区域时显示隐藏的DIV，离开时再次隐藏DIV。
只需设置display:none
即可将该元素设为隐藏的。默认的是显示的，即不设置display即默认显示。
isplay 属性规定元素应该生成的框的类型，定义建立布局时元素生成的显示框类型。
display的值可以取如下的值：
none此元素不会被显示。
block此元素将显示为块级元素，此元素前后会带有换行符。
inline默认。此元素会被显示为内联元素，元素前后没有换行符。
inline-block行内块元素。（CSS2.1 新增的值）
（1）1、js方法，这是一般网站常用的方法。优点：兼容性好，易管理。
实现方式：按钮
onclick
触发
目标div
显示/隐藏。
代码有很多。
2、纯css方法：这是为了应付考试，掌握灵活性而用
缺点：需要支持css3的浏览器，兼容性不佳。
实现方法：利用css的伪类选择，将整个一体放到一个div中，包括
触发按钮、标题、内容。在div的css上写高度、overflow:hidden，在hover或active伪类上写新的高度即可，并不太实用。特意为你写的示例：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style type="text/css">
#box { width:400pxheight:30pxborder:1px #666666 solidpadding:10pxoverflow:hidden}
#box h5{ border:1px #666666 solidheight:30pxmargin:0padding:0}
#box p{ border:1px #666666 solid}
#box:hover { height:100px}
</style>
</head>
<body>
<div id="box">
<h5>+ 标题</h5>
<p>这里是内容，也可以用 #box:active { height:100px}，这是鼠标按下的效果。</p>
</div>
</body>
</html>
（2）CSS是用级联样式表是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。
