<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{
margin: 0px;
padding: 0px;
list-style: none;
}
ul li{
float: left;
margin-left: 3px;
text-align: center;
border: 1px solid transparent;
width: 90px;
}
ul li ul {
display: none;
/* border: 1px solid red;*/
width: 100px;
}
</style>
</head>
<body>
<ul>
<li onmousemove="ss(1)" onmouseout="h()" >
<a href="http://www.baidu.com">首页|</a>
<ul id="s1">
<li><a href="#">公积金贷款</a></li>
<li><a href="#">公积金咨询</a></li>
<li><a href="#">公积金回答</a></li>
<li><a href="#">表格下载</a></li>
<li><a href="#">贷款计算器</a></li>
</ul>
</li>
<li onmousemove="ss(2)" onmouseout="h(2)">
<a href="#">公积金查询</a>
<ul id="s2">
<li><a href="#">公积金贷款</a></li>
<li><a href="#">公积金咨询</a></li>
<li><a href="#">公积金回答</a></li>
<li><a href="#">表格下载</a></li>
<li><a href="#">贷款计算器</a></li>
</ul>
</li>
<li onmousemove="ss(3)" onmouseout="h(3)">
<a href="#">政府法规</a>
<ul id="s3">
<li><a href="#">公积金贷款</a></li>
<li><a href="#">公积金咨询</a></li>
<li><a href="#">公积金回答</a></li>
<li><a href="#">表格下载</a></li>
<li><a href="#">贷款计算器</a></li>
</ul>
</li>
<li onmousemove="ss(4)" onmouseout="h(4)">
<a href="#">公积金提取</a>
<ul id="s4">
<li><a href="#">公积金贷款</a></li>
<li><a href="#">公积金咨询</a></li>
<li><a href="#">公积金回答</a></li>
<li><a href="#">表格下载</a></li>
<li><a href="#">贷款计算器</a></li>
</ul>
</li>
</ul>
</body>
<script>
function ss(num){
if(num==1){
document.getElementById("s1").style.display="block";
}else if(num==2){
document.getElementById("s2").style.display="block";
}else if(num==3){
document.getElementById("s3").style.display="block";
}else{
document.getElementById("s4").style.display="block";
}
}
function h(){
document.getElementById("s1").style.display="none";
document.getElementById("s2").style.display="none";
document.getElementById("s3").style.display="none";
document.getElementById("s4").style.display="none";
}
</script>
</html>
