在下面的下拉菜单中有由 etc 调用的 java 脚本函数。我onmouseover="openelement('menu2')" , onmouseover="openelement('menu3')"
不明白这是什么'menu2' , 'menu3'
。有人可以解释一下吗?整个程序如下。
下拉菜单 CSS & JS
<!--The CSS code.-->
<style type="text/css" media="screen">
#nav {
margin: 0;
padding: 0;
}
#nav li {
list-style: none;
float: left;
}
#nav li a {
display: block;
margin: 0 1px 0 0;
padding: 4px 10px;
width: 80px;
background: lavender;
color: black;
text-align: center;
text-decoration:none;
}
#nav li a:hover {
background: grey;
}
#nav ul {
position: absolute;
visibility: hidden;
margin: 0;
padding: 0;
border: 1px solid #ffffff
}
#nav ul li a{
position: relative;
margin: 0;
padding: 5px 10px;
width: 80px;
text-align: left;
background: lavender;
color: #000000;
}
#nav li ul li {
clear: both;
}
</style>
<!--The end of the CSS code.-->
<!--The Javascript menu code.-->
<script type="text/javascript">
//variables' declaration
var timeout = 500;
var timer = 0;
var item = 0;
//function for opening of submenu elements
function openelement(num)
{
keepsubmenu()
//checks whether there is an open submenu and makes it invisible
if(item){ item.style.visibility = 'hidden';}
//shows the chosen submenu element
item = document.getElementById(num);
item.style.visibility = 'visible';
}
// function for closing of submenu elements
function closeelement()
{
//closes the open submenu elements and loads the timer with 500ms
timer = window.setTimeout("if(item) item.style.visibility = 'hidden';",500);
}
//function for keeping the submenu loaded after the end of the 500 ms timer
function keepsubmenu()
{
if(timer){
window.clearTimeout(timer);
timer = null;
}
}
//hides the visualized menu after clicking outside of its area and expiring of the loaded timer
document.onclick = closeelement;
</script>
<!--END of CSS code-->
</head>
<body>
<!--HTML code for the menu -->
<ul id="nav">
<li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">Home</a>
</li>
<li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#" onmouseover="openelement('menu2')" onmouseout="closeelement()">Tutorials</a>
<ul id="menu2" onmouseover="keepsubmenu()" onmouseout="closeelement()" style="visibility: hidden; ">
<li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">CSS</a></li>
<li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">Flash</a></li>
</ul>
</li>
<li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#" onmouseover="openelement('menu3')" onmouseout="closeelement()">More</a>
<ul id="menu3" onmouseover="keepsubmenu()" onmouseout="closeelement()">
<li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">About Us</a></li>
<li><a href="http://www.sci.sjp.ac.lk/lms/file.php/233/dropDownJs.html#">Contact Us</a></li>
</ul>
</li>
</ul>
<div style="clear:both"></div>
<!--the end of the HTML code for the menu -->