Js menu

浏览数：19 / 时间：2015年06月09日

<!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="text/html; charset=gb2312" />
<title>menu</title>
<style>
	.menu{
			width:140px;
			height:100px;
			border-color:#33CCFF;
			border-style:solid;
			border-width:1px;
			}
	.functionCss{
			float:left;
			height:34px;
			width:110px;
		}
	.menuImgCss{
			float:left;
			height:34px;
			width:30px;
			}
</style>
<script type="text/javascript">
	 
 
	function selectDiv(obj,div1,div2){
		var d1 = document.getElementById(div1);
		var d2 = document.getElementById(div2);
		d1.style.backgroundColor="#FFFFFF";
		d2.style.backgroundColor="#FFFFFF";
		obj.style.backgroundColor="#B8DCFF";
	}
	function unSelectDiv(obj){

		obj.style.backgroundColor="#FFFFFF";
	}
	function aa() {
		document.getElementById("menu").style.display="block";
	}
	function bb() {
		document.getElementById("menu").style.display="none";
	}
</script>
</head>

<body>

	<div onmouseover="aa()" onmouseout="bb()">
		<div>click</div>
		<div id="menu" class="menu" style="display:none">
			<div id="menu1" style="background-color:#B8DCFF">
				<div class="menuImgCss"> 
					<img src="imgs/1.jpg" />
				</div>
				<div clas="functionCss" id="firstDiv" style="font-size:26px" onmouseover="selectDiv(this,'secondDiv','threeDiv')" onmouseout="unSelectDiv(this)">
					 click me  
				</div>
			</div>
			
			<div id="menu2" style="clear:both">
				<div class="menuImgCss"> 
					<img src="imgs/1.jpg"/>	</div>
				<div clas="functionCss" id="secondDiv" style="font-size:26px" onmouseover="selectDiv(this,'threeDiv','firstDiv')" onmouseout="unSelectDiv(this)">
					 click me  
				</div>
			</div>
			
			<div id="menu3" style="clear:both" >
				<div class="menuImgCss"> 
					<img src="imgs/1.jpg"/>	</div>
				<div clas="functionCss" id="threeDiv" style="font-size:26px" onmouseover="selectDiv(this,'secondDiv','firstDiv')" onmouseout="unSelectDiv(this)">
					 click me  
				</div>
			</div>
		</div>
	</div>
</body>
</html>