首页 > 代码库 > Javascript实现简单的下拉二级菜单

Javascript实现简单的下拉二级菜单

在线演示;http://jsfiddle.net/Web_Code/ThhbG/embedded/result/

<span style="font-size:14px;"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="content-type" content="texthtml;charset=utf-8">
	<title>Menu</title>
	<style type="text/css">
	    #nav
	    {
	    	list-style: none;
	    	text-align: center;
	    }
	    #nav li
	    {
	    	float: left;
	    	width: 100px;
	    	color: white;
	    	background-color: #3E3E3E;
	    }
	    #menu
	    {
	    	list-style: none;
	        padding: 5px;
	    	display: none;
	    	margin-left: -5px;
	    	margin-top: -5px;
	    }
	    #menu li
	    {
	    	background-color: #ccc;
	    	width: 100px;
	    	text-align: left;
	    	padding-left: 10px;
	    }
	    #menu li a:link
	    {
	    	text-decoration: none;
	    	display: block;
	    }
	    #menu li a:hover
	    {
	    	background-color:#3E3E3E;
	    	color: white
	    }
	</style>
</head>
<body>
	<ul id="nav">
		<li class="child">数 据 库
			<ul id="menu">
				<li><a href=http://www.mamicode.com/"http://blog.csdn.net/u011043843">MySQL>