您的位置:寻梦网首页编程乐园CSS 初步动态HTML 5 天通
动态HTML教程 - 第四天
Taylor 1998.3.9

第五页:使菜单具备相应的功能

下面要做的是给每个菜单条设定一个行为。你可以设定任何
一种行为,不一定非得是动态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 href="#" class="itemAnchor" 
    
    onclick="menuItem('captCursor'); return false">

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

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

动态HTML教程
第一页 让我们编写一些有用的东西
第二页 下拉菜单脚本
第三页 使菜单初具规模
第四页 完成菜单条的制作
第五页 使菜单具备相应的功能

[第1天][第2天][第3天][第4天][第5天]


本文本站根据《网猴》相关文章改编,版权归《网猴》所有