解读 M$ 源代码:javascript + CSS 实现动态菜单显示


<!--解读 M$ 源代码:JavaScript + CSS 实现动态菜单显示-->
<!--Default.htm-->
<!--小弟的 JavaScript 水平实在有够差劲,故以下注解均为个人理解,有疏漏及不当之处还请各位大虾指正-->
<!--以下源代码来源于 M$ Windows 2000 Professional 安装光盘的 DISCOVER/EASY2USE 目录,更改之处见文档的最后注解-->
<!--有关“单位”与“集合”的定义,请参见文档后面的注解-->
<HTML>
    <head>
        <meta http-equiv="Content-Type" content="text/HTML; charset=gb2312">
        <TITLE>更易使用</TITLE><!--注1-->
        <SCRIPT language="javascript">

var whichIm;
var varColor = "DDEEFF";

document.onmouseover = mouseOver;
document.onmouseout = mouseOut;
document.onmousedown = mouseDown;
document.onmouseup = mouseUp;

function mouseOver() {
  var vSrc = window.event.srcElement;
  if (vSrc.className == "child2" || vSrc.className == "child3" || vSrc.className == "parent")/*判断对象是否为“单位”*/ {
    fColor = vSrc.style.backgroundColor;
    vSrc.style.backgroundColor = varColor;
    /*注2*/
  }
}

function mouseOut() {
  var vSrc = window.event.srcElement;
  if (vSrc.className == "child2" || vSrc.className == "child3" || vSrc.className == "parent") {
    vSrc.style.backgroundColor = fColor;
    /*注2*/
  }
}

function mouseDown() {
  var vSrc = window.event.srcElement;
  divColl=document.all.tags("DIV");
  for (i=0; i < divColl.length; i++) {
      if (((divColl(i).className == "parent")||(divColl(i).className == "child2")||(divColl(i).className == "child3"))&&(divColl(i).id != vSrc.id))/*注3*/ {
        divColl(i).style.backgroundColor = "";
    }
    if (((divColl(i).className == "parent")||(divColl(i).className == "child2")||(divColl(i).className == "child3"))&&(divColl(i).id == vSrc.id))/*注3*/ {
         divColl(i).style.backgroundColor = "#FFFFFF";
         fColor = "#FFFFFF";
    }
}
}

function mouseUp() {
  var vSrc = window.event.srcElement;
  if (vSrc.className == "child2" || vSrc.className == "child3" || vSrc.className == "parent") {
    /*注2*/
  }
}
//<!-- Navigation functions -->

function closeAll(el) {
    divColl=document.all.tags("DIV");
    for (i=0; i<divColl.length; i++) {
        felEl=eval(el + "Child1");
        if ((divColl(i).className == "child1") && (felEl != divColl(i))) {
            divColl(i).style.display="none";
        }
    }
}

function navOnload() {
    divColl=document.all.tags("DIV");
    for (i=0; i< divColl.length; i++) {
        if (divColl(i).className == "child1" || divColl(i).className == "child4") {
            if (divColl(i).className == "child4" && divColl(i).style.display == "block") {
                whichArrow = eval(divColl(i).Arr);
                whichArrow.src = "../images/tocuparw.gif";
            }
        }
    }
}

function expandIE(el) {
    whichEl=eval(el + "Child1");
    closeAll(el);
    if (whichEl.style.display != "block") {
        whichEl.style.display = "block";
        whichEl.isExpanded=true;
    }/*注4*/else {
        whichEl.style.display = "none";
        whichEl.isExpanded=false;
    }/*注4*/
}


function expandIE2(el) {
    whichEl=eval(el + "Child3");   
    whichIm=event.srcElement;   
    if (whichEl.style.display != "block") {//当被点击对象没有展开下级菜单时,展开下级菜单
        whichEl.style.display = "block";
        whichEl.isExpanded=true;
        whichArrow = eval(whichIm.Arr);
        whichArrow.src = "../images/tocuparw.gif";
    } else {//当被点击对象已经展开下级菜单时,隐藏下级菜单
        whichEl.style.display="none";
        whichEl.isExpanded=false;
        whichArrow = eval(whichIm.Arr);
        whichArrow.src = "../images/tocdnarw.gif";
    }
}
            </SCRIPT>
        <!--注1-->
        <style>
            A:link
            {
             color:000000;
             text-decoration: none;
            }
            A:visited
            {
             color:666666;
           &nb进入讨论组讨论。

本文作者:
« 
» 
快速导航

Copyright © 2016 phpStudy | 豫ICP备2021030365号-3