JavaScript下拉菜单问题
<!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> 下拉菜单 </title>
<script type= "text/javascript ">
<!--
va theShowLayIndex = 0;
function showSubMenu(theIndex)
{
alert( "zx ");
var subLay;
for(var i=1;i <5;i++)
{
subLay = "lay " + i;
document.getElementById(subLay).style.visibility = "hidden ";
}
subLay = "lay " + i;
document.getElementById(subLay).style.visibility = "visible ";
document.getElementById(subLay).style.top = parseInt(document.getElementById( "lay0 ").style.top) + document.getElementById( "lay0 ").clientHeight;
theShowLayIndex = theIndex;
}
function hideSubMenu(theIndex)
{
var subLau = "lay " + theIndex;
document.getElementById(subLay).style.visibility = "hidden ";
}
function hideLay()
{
alert( "zx ");
var theShowLay = "lay " + theShowLayIndex;
var theX1 = parseInt(document.getElementById(theShowLay).style.left);
var theX2 = theX1 + document.getElementById(theShowLay).clientWidth;
var theY1 = parseInt(document.getElementById( "lay0 ").style.top);
var theY2 = theY1 + document.getElementById( "lay0 ").clientHeight + document.getElementById(theShowLay).clientHeight;
if(event.clientX < theX1 || event.clientX > theX2 || event.clientY < theY1 ||event.clientY > theY2)
{
for(var i=1;i <5;i++)
{
subLay = "lay " + i;
document.getElementById(subLay).style.visibility = "hidden ";
}
}
}
//-->
</script>
</head>
<body>
<img src= "top.gif " />
<br />
<div id= "lay0 " style= "position:absolute; top:90px; ">
<table width= "100% " id= "theMenu " cellpadding= "0 " cellspacing= "0 " bgcolor= "#BEC8F0 " style= "border-bottom:1px solid #CCCCCC; ">
<tr>
<td>
<table>
<tr>
<td width= "100px "> </td>
<td id= "td1 " onmouseover= "showSubMenu( '1 '); ">
<a href= "http://www.sohu.com "> 学院概况 </a>
</td>
<td id= "td2 " onmouseover= "showSubMenu(2); ">
<a href= "http://www.sohu.com "> 学院建设