实现下拉菜单显示隐藏的方法。

来源:互联网 发布:快速傅里叶变换算法fc 编辑:程序博客网 时间:2024/05/01 12:26

<!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" lang="gb2312">
 <head>
<style type="text/css">
<!--
body{
font-size:14px;
color:#6600FF;
}
ul{
margin:0;
padding:0;
list-style:none;
}
ul li{
padding:2px 0;
}
#MenuItems{
background-color:#CCCCCC;
border:2px solid #616161;
width:100px;
display:none;
padding:5px 5px;
}
-->
</style>
<script type="Text/JavaScript">
<!--
function mouse ()
{
document.getElementById("MenuItems1").onmousemove = function(){document.getElementById("MenuItems").style.display = "block";}
document.getElementById("MenuItems").onmouseover = function(){document.getElementById("MenuItems").style.display = "block";}
document.getElementById("MenuItems").onmouseout = function(){document.getElementById("MenuItems").style.display = "none";}

}
//-->
</script>
<title> New Document </title>
<meta name="Generator" content="EditPlus" />
<meta name="Author" content="" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
 </head>
 <body onload="mouse()">
<a href="#" onclick="return true" id="MenuItems1">Move</a>
<div id="MenuItems">
<ul>
<li><a class="menu" href="#">国内新闻</a></li>
<li><a class="menu" href="#">国外新闻</a></li>
<li><a class="menu" href="#">全部新闻</a></li>
</ul>
</div>
 </body>
</html> 

原创粉丝点击