* 菜单技术 

　　访问过Microsoft和Macromedia站点的人如果细心的话，一定会注意到其中的菜单技术，点击一下出现子菜单，再点一下隐去子菜单，很是有趣和实用。笔者分别下载了这两个页面，在对源码进行分析之后，发现他们用的并不是同一种方法，而且两种方法各有利弊，下面让我们来看一下他们都是如何实现的。 

　　Macromedia 采用的是多页技术。就是先做一个没有展开项的主菜单的页面，然后分别制作每一个主菜单项展开后的页面，主菜单有多少项，就得做多少个子页面与之相对应。下面我们举个简单的例子加以说明： 
　　<html> 

　　<head> 

　　<title>A menu example</title> 

　　<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 

　　</head> 

　　<body bgcolor="#FFFFFF"> 

　　<a name="abc"></a><p> 

　　<a href="menu_2.htm#abc"><b>Click here!</b></a> 

　　</body> 

　　</html> 

　　<html> 

　　<head> 

　　<title>A menu example</title> 

　　<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 

　　</head> 

　　<body bgcolor="#FFFFFF"> 

　　<p><a name="abc"></a></p> 

　　<p><a href="menu_1.htm#abc"> 

　　<b>Click here!</b></a> </p> 

　　 list 1

　　 list 2

　　 list 3

　　</body> 

　　</html> 
　　点击图1中的Click here!就会出现图2的效果。具体实现时，一定要注意标签<a name=" ">的定义和使用，要做到一一对应，否则就会乱套。另外，当菜单项很多时，记住只有当前列出的子菜单处用<a name=" ">来定义，别的主菜单项应分别链接到它相应展开的页面去。 

　　这种方法实现得很简单，一般人很快就能掌握，而且任何浏览器均可支持，但它的缺点也是明显的。首先是慢，来回调用各个页面必然带来长时间的等待，只有页面上都是文字时，才感觉不到停滞；再就是编制困难，虽然技术简单，但是一个一个地制作实在是有点麻烦。因此，这种技术还是有一定的局限性的。 

　　Microsoft采用的是DHTML技术。DHTML是比较新的技术，因此对于一些“古老”的浏览器来说，这种菜单实现方式就无能为力了。 

　　我们还是举个例子来说明一下。 

　　如图3，单击 Product & Services 立刻就出现了下面的菜单，再点一下又隐去了，和Macromedia的一样，不同的是仿佛快了许多，它的源代码如下。 

　　<html> 

　　<head> 

　　<meta HTTP-EQUIV="Content-Type" content="text/html; charset=iso-8859-1"> 

　　<title>Welcome to Microsoft's Homepage</title>  　 

　　<style TYPE="text/css"> 

　　.NV1 {font-family:Arial;font-weight:bold;font-size:.9em;cursor:hand;margin-top:10;text-indent: -14;margin-left: 14;} 

　　.NV2 {position:relative;font-size:.9em;font-weight:normal;} 

　　</style>  　 

　　</head> 

　　<body>  　　 

　　<script TYPE="text/javascript"> 

　　 function clikker(a,b) { 

　　 if (a.style.display ==') { 

　　 a.style.display = 'none'; 

　　 b.src='usm.gif'; 

　　 } 

　　 else { 

　　 a.style.display='; 

　　 b.src='dsmh.gif'; 

　　 } 

　　 } 

　　</script> 
页次:1/4  1篇/页  首页   上一页   下一页   尾页  合计 4 篇 Go:第1页第2页第3页第4页