|
说明: 有色的树形菜单
效果:
运行后查看！
代码: 第一步:把如下代码加入<head>区域中
[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
第二步:把如下代码加入<body>区域中:
<!---------- begin OUTLINE ----------->
<A HREF="#" onClick="expandAll(false);
return false">
<IMG NAME="imEx" SRC="bullet-plus.gif"
WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开/关闭全部">
<FONT COLOR="#008000">全部菜单</FONT></A>
<!-- <span style="background: #00FFFF; color:
black">展开/关闭全部</span> -->
<!-- <BLOCKQUOTE> --> <!-- 第一级父菜单 -->
<DIV ID="elOneParent" CLASS=parent style="margin-left:
0.5em">
<A HREF="#" style="color:#C000FF; text-decoration:none;"
onClick="expandIt('elOne'); return false"><IMG
NAME="imEx" SRC="bullet-plus.gif" WIDTH=9
HEIGHT=9 BORDER=0>主菜单一</A>
</DIV>
<!-- 第一级子菜单 -->
<DIV ID="elOneChild" CLASS=child style="margin-left:
1em">
<A HREF="1.htm" target="data">子页面一</A><BR>
<A HREF="2.htm" target="data">子页面二</A><BR>
<A HREF="3.htm" target="data">子页面三</A><BR>
<A HREF="4.htm" target="data">子页面四</A>
</DIV>
<!-- 第二级父菜单 -->
<DIV ID="elTwoParent" CLASS=parent style="margin-left:
0.5em">
<A HREF="#" style="color:#C000FF; text-decoration:none;"
onClick="expandIt('elTwo'); return false"><IMG
NAME="imEx" SRC="bullet-plus.gif"
WIDTH=9 HEIGHT=9 BORDER=0>主菜单二</A>
</DIV>
<!-- 第二级子菜单 -->
<DIV ID="elTwoChild" CLASS=child style="margin-left:
1em">
<A HREF="1.htm" target="data">子页面一</A><BR>
<A HREF="2.htm" target="data">子页面二</A><BR>
<A HREF="3.htm" target="data">子页面三</A><BR>
<A HREF="4.htm" target="data">子页面四</A>
</DIV>
<!-- 第三级父菜单 -->
<DIV ID="elThreeParent" CLASS=parent style="margin-left:
0.5em">
<A HREF="#" style="color:#C000FF; text-decoration:none;"
onClick="expandIt('elThree'); return false"><IMG
NAME="imEx" SRC="bullet-plus.gif"
WIDTH=9 HEIGHT=9 BORDER=0>主菜单三</A>
</DIV>
<!-- 第三级子菜单 -->
<DIV ID="elThreeChild" CLASS=child style="margin-left:
1em">
<A HREF="1.htm" target="data">子页面一</A><BR>
<A HREF="2.htm" target="data">子页面二</A><BR>
<A HREF="3.htm" target="data">子页面三</A><BR>
<A HREF="4.htm" target="data">子页面四</A>
</DIV>
| 
