<div class="codetitle"> <span><a style="CURSOR: pointer" data="51696" class="copybut" id="copybut51696" onclick="doCopy('code51696')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code51696"> <br><span style="font-size:14px;"> <br> <br> <br><meta http-equiv="content-type" content="texthtml;charset=utf-8"> <br><title>Menu</title> <br><style type="text/css"> <BR>#nav <BR>{ <BR>list-style: none; <BR>text-align: center; <BR>} <BR>#nav li <BR>{ <BR>float: left; <BR>width: 100px; <BR>color: white; <BR>background-color: #3E3E3E; <BR>} <BR>#menu <BR>{ <BR>list-style: none; <BR>padding: 5px; <BR>display: none; <BR>margin-left: -5px; <BR>margin-top: -5px; <BR>} <BR>#menu li <BR>{ <BR>background-color: #ccc; <BR>width: 100px; <BR>text-align: left; <BR>padding-left: 10px; <BR>} <BR>#menu li a:link <BR>{ <BR>text-decoration: none; <BR>display: block; <BR>} <BR>#menu li a:hover <BR>{ <BR>background-color:#3E3E3E; <BR>color: white <BR>} <BR></style> <br> <br> <br><ul id="nav"> <br><li class="child">数 据 库 <br><ul id="menu"> <br><li><a href="http://blog.csdn.net/u011043843">MySQL</a></li> <br><li><a href="http://blog.csdn.net/u011043843">SQL Server</a></li> <br><li><a href="http://blog.csdn.net/u011043843">Oracle</a></li> <br><li><a href="http://blog.csdn.net/u011043843">DB2</a></li> <br> </ul> <br> </li> <br><li class="child">前台脚本 <br><ul id="menu"> <br><li><a href="http://blog.csdn.net/u011043843">JavaScript</a></li> <br><li><a href="http://blog.csdn.net/u011043843">Ruby</a></li> <br><li><a href="http://blog.csdn.net/u011043843">HTML</a></li> <br><li><a href="http://blog.csdn.net/u011043843">Python</a></li> <br> </ul> <br> </li> <br><li class="child">后台脚本 <br><ul id="menu"> <br><li><a href="http://blog.csdn.net/u011043843">PHP</a></li> <br><li><a href="http://blog.csdn.net/u011043843">ASP</a></li> <br><li><a href="http://blog.csdn.net/u011043843">ASP.NET</a></li> <br><li><a href="http://blog.csdn.net/u011043843">JSP</a></li> <br> </ul> <br> </li> <br> </ul> <br><script type="text/javascript"> <BR>var lis = document.getElementById("nav").getElementsByTagName('li'); <BR>var i = 0; <br><br>for( i = 0; i < lis.length; i++) <BR>{ <BR>if(lis[i].className == "child") <BR>{ <BR>lis[i].onmouseover = function() <BR>{ <BR>var ulObj1 = this.getElementsByTagName('ul')[0]; <BR>ulObj1.style.display = "block"; <BR>this.style.backgroundColor="#ccc"; <BR>this.style.color="black"; <BR>} <BR>} <br><br>lis[i].onmouseout = function() <BR>{ <BR>var ulObj1 = this.getElementsByTagName('ul')[0]; //this是HTMLElement对象 <BR>ulObj1.style.display = "none"; <BR>this.style.backgroundColor="#3E3E3E"; <BR>this.style.color="white"; <BR>} <BR>} <br><br></script> <br> <br></span> <br> </div>