4.4 完成菜单条的制作.pdf

4.4 完成菜单条的制作 现在给菜单条加入脚本使其能响应鼠标的行为并执行相应的功能。我们利用 visibility 属性隐藏子菜单项目并在菜单项目被点击时显示子菜单。 处理visibility时，你会立刻遇到DOM不兼容的问题。Netscape的DOM更多地 受其LAYER标签和属性的影响。所以即使在DOM中你将一个对象的visibility 属性设置为hidden（隐藏），Netscape也会将其显示出来。如果你加入下面这 条： if (daMenu.visibility == hidden) 你所得到的不是样式表语法的参数值，而是LAYERS语法的参数值。 所以如果你设置document.foo.visibility = visible, 则代码将会按照你预 想的那样执行，对象foo在屏幕中可以被看到。如果你用 alert(document.foo.visibility)检查参数值, 则返回的数值是show。解决办 法是设置一些变量，用标准的条件并设定一个名为visible的变量用于Netscape 中的show，在Internet Explorer中则设置visible。 在Netscape中设置一个名为hide 的变量，在Internet Explorer则用 hidden。在相应的字符串位置放入这些变量，则问题就解决了。 script if (document.layers) { visible = show; hidden = hide; } else if (document.all) { visible = visible; hidden = hidden; } function barTog(menu) { if (document.layers) { daMenu = document.layers[menu]; } else if (document.all) { daMenu = document.all(menu).style; } if (daMenu.visibility == visible) { daMenu.visibility = hidden; } else { daMenu.visibility = visible; } lastMenu = daMenu; } /script barTog函数所做的是设置标准的条件语句，如果在被传送的变量菜单中设定的 对象是visible，则隐藏该对象，否则就显示该对象。然后将对该对象的引用传 递给名为lastMenu的全局变量（这样以来，以后你可以再关闭它）。接下来你 要做的就是调用这个函数，所以在菜单条中你将Webmonkey设定一个anchor （锚区），并设定被点击是执行的行为。 div id=webmonkey class=daMenu a href=# class=itemAnchor onclick=javascript: barTog(moreMonkey); return false; Webmonkey /a