-->动态HTML教程-->4.5 使菜单具备相应的功能

Dynamic HTML

后页 前页
目录
北极星书库
4.5 使菜单具备相应的功能


下面要做的是给每个菜单条设定一个行为。你可以设定任何一种行为,不一定非得是动态HTML。但由于本教程讲的是动态HTML,而我们的课题是将如何改变layers的visibility(可视性)属性 。所以我们为每一个菜单项目设定隐藏和显示包含相应的网猴图象的层(layer)。

    <script>
    
    function menuItem(item){
    if (document.layers) {
    daLast = document.layers[lastItem];
    daItem = document.layers[item];
    } else if (document.all) {
    daLast = document.all(lastItem).style;
    daItem = document.all(item).style;
    }
    daLast.visibility = hidden;
    daItem.visibility = visible;
    lastMenu.visibility = hidden;
    lastItem = item;
    }


    var lastItem = 'aaron';


    </script>

这段脚本仍然用我们的老朋友--条件语句调用两个对象,现调用item,然后是最后被打开的lastitem(lastItem的缺省设置是'aaron' ),并且该语句还要记忆被打开的最后一个菜单(我们在barTog中设置的lastMenu)。设置完所有visibility后还记忆lastItem。


下面需要给每个菜单项目加上相应的anchor调用。

    <a  class="itemAnchor"
    
    onclick="menuItem('captCursor'); return false">

这条代码调用menuItem函数,并指示其显示ID为"captCursor"的DIV。现在将anchor锚定每个菜单项目并将每个DIV指向相应的网猴的名称。现在当你从菜单中选择相应的菜单时就会显示相应的图片


现在你可以制作你自己的菜单并在其中加入自己的菜单项目,隐藏及显示DIV,并在DIV中加入表单元素。明天的课程中我们将结合前面所学的知识作一个完整的展示。


后页
前页
目录
北极星书库