树形菜单的制作
1、制作一级主菜单，例如：文学艺术
< A href="javascript:onClick=show('对应二级菜单的ID名') ">< IMG src="image/fclose.gif" border="0" align="absmiddle" >文学艺术< /A>
调用show()函数来实现二级菜单的显示及隐藏
2、用层制作二级菜单
< DIV id="层ID名称"style="display:none"
< IMG src="image/doc.gif" align="absmiddle">先锋写作
< IMG src="image/doc.gif" align="absmiddle">小说散文
< IMG src="image/doc.gif" align="absmiddle">诗风词韵
< IMG src="image/doc.gif" align="absmiddle">幻影奇侠
< IMG src="image/doc.gif" align="absmiddle">童话故事< /DIV>
说明：style="display:none"二级层菜单处于隐状态
3、制作效果：当点击“文学艺术”一级菜单时，“先锋写作、小说散文、诗风词韵、幻影奇侠”二级菜单显示，当再次点击“文学艺术”一级菜单时，下面的二级菜单处于隐藏状态，直接点击查看上面的菜单效果
4、依次制作各级一级、二级菜单
三、实现树形菜单的源代码：
< A href="javascript:onClick=show('对应二级菜单的ID名') ">< IMG src="image/fclose.gif" border="0" align="absmiddle" >文学艺术< /A>
调用show()函数来实现二级菜单的显示及隐藏
2、用层制作二级菜单
< DIV id="层ID名称"style="display:none"
< IMG src="image/doc.gif" align="absmiddle">先锋写作
< IMG src="image/doc.gif" align="absmiddle">小说散文
< IMG src="image/doc.gif" align="absmiddle">诗风词韵
< IMG src="image/doc.gif" align="absmiddle">幻影奇侠
< IMG src="image/doc.gif" align="absmiddle">童话故事< /DIV>
说明：style="display:none"二级层菜单处于隐状态
3、制作效果：当点击“文学艺术”一级菜单时，“先锋写作、小说散文、诗风词韵、幻影奇侠”二级菜单显示，当再次点击“文学艺术”一级菜单时，下面的二级菜单处于隐藏状态，直接点击查看上面的菜单效果
4、依次制作各级一级、二级菜单
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>树形菜单</TITLE>
<STYLE type="text/css">
DIV {
FONT-SIZE: 13px; COLOR: #000000; LINE-HEIGHT: 22px;
}
A{FONT-SIZE: 13px; COLOR: #000000; TEXT-DECORATION: none}
A:hover {FONT-SIZE: 13px; COLOR: #999999}
</STYLE>
<SCRIPT language="JavaScript">
function show(d1){
if(document.getElementById(d1).style.display=='none'){
document.getElementById(d1).style.display='block'; //触动的层如果处于隐藏状态，即显示
}
else{document.getElementById(d1).style.display='none'; //触动的层如果处于显示状态，即隐藏
}
}
</SCRIPT>
</HEAD>
<BODY>
<DIV HEIGHT="30"><FONT color="#CC0000" ><B><IMG src="image/fold.gif" width="16" height="16" align="absmiddle">树形菜单：</B></FONT></DIV>
<A href="javascript:onClick=show('1') "><IMG src="image/fclose.gif" border="0" align="absmiddle" >文学艺术</A>
<DIV id="1" style="display:none"><IMG src="image/doc.gif" align="absmiddle">先锋写作<BR>
<IMG src="image/doc.gif" align="absmiddle">小说散文<BR>
<IMG src="image/doc.gif" align="absmiddle">诗风词韵</DIV>
<DIV><A href="javascript: onClick=show('2') "><IMG src="image/fclose.gif" border="0" align="absmiddle">贴图专区</A></DIV>
<DIV id="2" style="display:none"><IMG src="image/doc.gif" align="absmiddle">真我风采<BR>
<IMG src="image/doc.gif" align="absmiddle">视频贴图<BR>
<IMG src="image/doc.gif" align="absmiddle">行行摄摄<BR>
<IMG src="image/doc.gif" align="absmiddle">Flash贴图</DIV>
</BODY>
</HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>树形菜单</TITLE>
<STYLE type="text/css">
DIV {
FONT-SIZE: 13px; COLOR: #000000; LINE-HEIGHT: 22px;
}
A{FONT-SIZE: 13px; COLOR: #000000; TEXT-DECORATION: none}
A:hover {FONT-SIZE: 13px; COLOR: #999999}
</STYLE>
<SCRIPT language="JavaScript">
function show(d1){
if(document.getElementById(d1).style.display=='none'){
document.getElementById(d1).style.display='block'; //触动的层如果处于隐藏状态，即显示
}
else{document.getElementById(d1).style.display='none'; //触动的层如果处于显示状态，即隐藏
}
}
</SCRIPT>
</HEAD>
<BODY>
<DIV HEIGHT="30"><FONT color="#CC0000" ><B><IMG src="image/fold.gif" width="16" height="16" align="absmiddle">树形菜单：</B></FONT></DIV>
<A href="javascript:onClick=show('1') "><IMG src="image/fclose.gif" border="0" align="absmiddle" >文学艺术</A>
<DIV id="1" style="display:none"><IMG src="image/doc.gif" align="absmiddle">先锋写作<BR>
<IMG src="image/doc.gif" align="absmiddle">小说散文<BR>
<IMG src="image/doc.gif" align="absmiddle">诗风词韵</DIV>
<DIV><A href="javascript: onClick=show('2') "><IMG src="image/fclose.gif" border="0" align="absmiddle">贴图专区</A></DIV>
<DIV id="2" style="display:none"><IMG src="image/doc.gif" align="absmiddle">真我风采<BR>
<IMG src="image/doc.gif" align="absmiddle">视频贴图<BR>
<IMG src="image/doc.gif" align="absmiddle">行行摄摄<BR>
<IMG src="image/doc.gif" align="absmiddle">Flash贴图</DIV>
</BODY>
</HTML>
