Css实现的鼠标滑动选项卡菜单代码
代码简介：
流行鼠标滑动菜单，实际上这是一个大家常说的滑动门特效，鼠标经过后相应版块随之变化。
代码内容：
<html>
<head>
<title>Css实现的鼠标滑动选项卡菜单代码_网页代码站(www.webdm.cn)</title>
<style type="text/css">
<!--
body {
margin: 0px;
}
#header {
background-color: #ffffff;
height: 286px;
width: 687px;
margin: 0px;
padding: 0px;
border: 1px solid #CCCCCC;
font-size: 12px;
}
#menu {
margin: 0px;
padding: 0px;
list-style:none;
}
#menu li {
list-style:none;
display: block;
width: 137px;
height: 23px;
text-align: center;
float: left;
margin: 0px;
padding-right: 0px;
padding-left: 0px;
line-height: 23px; height: 23px
}
.sec1 { background-image: url(http://www.webdm.cn/images/20090919/btn_bg.gif);float: left;list-style-type: none; height: 23px;border-right:1px
solid #B0BEC7;border-bottom:1px solid #B0BEC7;}
.sec2 { background: url(http://www.webdm.cn/images/20090919/btn_select.gif);position: relative; height: 23px;border-right:1px solid
#B0BEC7;border-bottom:1px solid #FFFFFF;color: #FF0000}
.block { display: block;list-style:none;}
.unblock { display: none;list-style:none;}
.pic img {
padding: 3px;
border: 1px solid #ccc;
}
-->
</style>
</head>
<body>
<script language=javascript>
function secBoard(n)
{
for(i=0;i<menu.childNodes.length;i++)
menu.childNodes[i].className="sec1";
menu.childNodes[n].className="sec2";
for(i=0;i<main.childNodes.length;i++)
main.childNodes[i].style.display="none";
main.childNodes[n].style.display="block";
}
</script>
<div id="header">
<ul id="menu">
<li onMouseOver="secBoard(0)" class="sec2">WebDm.Cn</li>
<li onMouseOver="secBoard(1)" class="sec1">ASP</li>
<li onMouseOver="secBoard(2)" class="sec1">PHP</li>
<li onMouseOver="secBoard(3)" class="sec1">EXTJS</li>
<li onMouseOver="secBoard(4)" class="sec1">JSP</li>
</ul>
<ul id="main">
<li class="block">
<a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码！</li>
<li class="unblock">ASP的内容</li>
<li class="unblock">PHP的内容</li>
<li class="unblock">EXTJS的内容</li>
<li class="unblock">JSP的内容</li>
</ul>
</div>
</body>
</html>
<br>
<a href="http://www.webdm.cn">网页代码站</a> - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码！
代码来自：http://www.webdm.cn/webcode/0988db7c-6736-4857-9065-6e48d17964e4.html
