NS4 = (document.layers) ? 1 : 0; IE4 = (document.all) ? 1 : 0; ver4 = (NS4 || IE4) ? 1 : 0; | 声明几个变量。当用户的浏览器是IE时,变量IE4的值为1,当用户的浏览器是Netscape时,变量NS4的值为1,当用户的浏览器是IE或是Netscape时,变量ver4的值为1。 |
if (ver4) { with (document) {write("<STYLE TYPE='text/css'>"); if (NS4) { write(".parent{position:absolute; visibility:visible}"); write(".child {position:absolute; visibility:visible}"); write(".regular {position:absolute; visibility:visible}") } else { write(".child {display:none}") } write("</STYLE>"); } } | 这段代码相当于一个样式,定义各个层的位置及显示状态。 |
function getIndex(el) { ind = null; for (i=0; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.id == el) { ind = i; break; } } return ind; } | 定义一个函数getIndex,功能是获得变量ind的值。 |
function arrange() { nextY = document.layers[firstInd].pageY +document.layers[firstInd].document.height; for (i=firstInd+1; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.visibility != "hide") { whichEl.pageY = nextY; nextY += whichEl.document.height; } } } | 定义一个函数arrange(),功能就是定义一下页面上元素的位置。当菜单打开时,页面上菜单以下的东西的位置顺序往下推,菜单合起时,菜单以下的东西自动上移。 |
function initIt() { if (!ver4) return; if (NS4) { for (i=0; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.id.indexOf("Child") != -1) whichEl.visibility = "hide"; } arrange(); } else { divColl = document.all.tags("DIV"); for (i=0; i<divColl.length; i++) { whichEl = divColl(i); if (whichEl.className == "child") whichEl.style.display = "none"; } } } | 定义函数initIt(),页面载入时,首先调用该函数。功能是初始化菜单,让页面载入时,菜单处于未打开状态。 |
function expandIt(el) { if (!ver4) return; if (IE4) { whichEl = eval(el + "Child"); if (whichEl.style.display == "none") { whichEl.style.display = "block"; } else { whichEl.style.display = "none"; } } else { whichEl = eval("document." + el + "Child"); if (whichEl.visibility == "hide") { whichEl.visibility = "show"; } else { whichEl.visibility = "hide"; } arrange(); } } onload = initIt; | 定义一个函数expandIt(el)。由于层的可见状态在IE浏览器和NetScape浏览器中的解释是不同的,所以要分别讨论,判断菜单的状态。如果菜单是打开的,那么当再点击时,子菜单就不可见;如果菜单是关闭状态,那么当再点击时,子菜单就可见。 |
| <div id="KB1Parent" class="parent"> <a href="#" onClick="expandIt('KB1'); return false" > <img src="img/plus.gif" border=0>文件夹一</a></div> 。。。 <a href="sample.htm" target="_blank" ><img src="img/spacer.gif" border=0 alt=""><img src="img/open.gif" border=0>页面三</a> | 这一部分是页面上所显示的部分,包括那些形象的小“文件夹”图标,和文字。 |
<script language="JavaScript"> if(NS4){ firstEl = "KB1Parent"; firstInd = getIndex(firstEl); arrange(); } </script> | 如果用户的浏览器是NetScape,先初始化一下变量。 |