实时在线客服系统,服务时间为早8点到晚22点 自助建站论坛,即将开通
用户名:
密 码:
当前位置: 首页 >> 建站指南 >> 自助建站制作技巧 >> 树形菜单原码
树形菜单原码

作者:admin     来源:本站原创     发表时间:2006-06-06     浏览次数:    字号:    
 
 

脚本说明:
第一步:把如下代码加入<head>区域中
<SCRIPT LANGUAGE="JavaScript">
<!--
var bV=parseInt(navigator.appVersion);
var NS4=(document.layers) ? true : false;
var IE4=((document.all)&&(bV>=4))?true:false;
var ver4 = (NS4 || IE4) ? true : false;

function expandIt(){return}
function expandAll(){return}
function nomsg(){self.status="";}

if(ver4){
  document.write("<SCR"+"IPT LANGUAGE=\"JavaScript\" SRC=\"rsmenu.js\"></SCR"+"IPT>");
}
//-->
</SCRIPT>

第二步:把如下代码加入<body>区域中
<span class="label"></span><br>
<!---------- begin OUTLINE ----------->
<!--上方全部展开/关闭-->
<A HREF="#" onClick="expandAll(false); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开或关闭全部菜单"><FONT STYLE="font-size: 9pt">展开/关闭全部</FONT></A>
<!-- <BLOCKQUOTE> -->

<!--第一级父菜单-->
<DIV ID="elOneParent" CLASS=parent style="margin-left: 0.1px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=101><tr><td class=label>
<A HREF="#" style="color:#FFFF00; text-decoration:none;"  onClick="expandIt('elOne'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开全部菜单"> 主菜单一
</a></td></tr></table>
</DIV>
<!--第一级子菜单-->
<DIV ID="elOneChild" CLASS=child style="margin-left: 0.5px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=96>
<tr><td>
        <A HREF="1.htm" target="data">连接页面1</A><BR>
</td></tr><tr><td>
        <A HREF="2.htm" target="data">连接页面2</A><BR>
</td></tr><tr><td>
 <A HREF="3.htm" target="data">连接页面3</A><BR>
</td></tr><tr>
      <td height="12"> <A HREF="4.htm" target="data">连接页面4</A> </td>
    </tr></table>
</DIV>

<!--第二级父菜单-->
<DIV ID="elTwoParent" CLASS=parent style="margin-left: 0.1px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=101><tr><td class=label>
<A HREF="#" style="color:#FFFF00; text-decoration:none;"  onClick="expandIt('elTwo'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开全部菜单"> 主菜单二
</a></td></tr></table>
</DIV>

<!--第二级子菜单-->
<DIV ID="elTwoChild" CLASS=child style="margin-left: 0.5px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=96>
<tr><td>
        <A HREF="1.htm" target="data">连接页面1</A><BR>
</td></tr><tr><td>
        <A HREF="2.htm" target="data">连接页面2</A><BR>
</td></tr><tr><td>
 <A HREF="3.htm" target="data">连接页面3</A><BR>
</td></tr><tr><td>
 <A HREF="4.htm" target="data">连接页面4</A>
</td></tr></table>
</DIV>

<!--第三级父菜单-->
<DIV ID="elThreeParent" CLASS=parent style="margin-left: 0.1px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=101><tr><td class=label>
<A HREF="#" style="color:#FFFF00; text-decoration:none;"  onClick="expandIt('elThree'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开全部菜单"> 主菜单三
</a></td></tr></table>
</DIV>

<!--第三级子菜单-->
<DIV ID="elThreeChild" CLASS=child style="margin-left: 0.5px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=96>
<tr><td>
        <A HREF="1.htm" target="data">连接页面1</A><BR>
</td></tr><tr><td>
        <A HREF="2.htm" target="data">连接页面2</A><BR>
</td></tr><tr><td>
 <A HREF="3.htm" target="data">连接页面3</A><BR>
</td></tr><tr><td>
 <A HREF="4.htm" target="data">连接页面4</A>
</td></tr></table>
</DIV>

<!--第四级父菜单-->
<DIV ID="elFourParent" CLASS=parent style="margin-left: 0.1px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=101><tr><td class=label>
<A HREF="#" style="color:#FFFF00; text-decoration:none;"  onClick="expandIt('elFour'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开全部菜单"> 主菜单四
</a></td></tr></table>
</DIV>

<!--第四级子菜单-->
<DIV ID="elFourChild" CLASS=child style="margin-left: 0.5px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=96>
<tr><td>
        <A HREF="1.htm" target="data">连接页面1</A><BR>
</td></tr><tr><td>
        <A HREF="2.htm" target="data">连接页面2</A><BR>
</td></tr><tr><td>
 <A HREF="3.htm" target="data">连接页面3</A><BR>
</td></tr><tr><td>
 <A HREF="4.htm" target="data">连接页面4</A>
</td></tr></table>
</DIV>

<!--第五级父菜单-->
<DIV ID="elFiveParent" CLASS=parent style="margin-left: 0.1px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=101><tr><td class=label>
<A HREF="#" style="color:#FFFF00; text-decoration:none;"  onClick="expandIt('elFive'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开全部菜单"> 主菜单五
</a></td></tr></table>
</DIV>

<!--第五级子菜单-->
<DIV ID="elFiveChild" CLASS=child style="margin-left: 0.5px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=96>
<tr><td>
        <A HREF="1.htm" target="data">连接页面1</A><BR>
</td></tr><tr><td>
        <A HREF="2.htm" target="data">连接页面2</A><BR>
</td></tr><tr><td>
 <A HREF="3.htm" target="data">连接页面3</A><BR>
</td></tr><tr><td>
 <A HREF="4.htm" target="data">连接页面4</A>
</td></tr></table>
</DIV>

<!--第六级父菜单-->
<DIV ID="elSixParent" CLASS=parent style="margin-left: 0.1px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=101><tr><td class=label>
<A HREF="#" style="color:#FFFF00; text-decoration:none;"  onClick="expandIt('elSix'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开全部菜单"> 主菜单六
</a></td></tr></table>
</DIV>

<!--第六级子菜单-->
<DIV ID="elSixChild" CLASS=child style="margin-left: 0.5px">
<TABLE BORDER=1 CELLSPACING=0 CELLPADDING=0 WIDTH=96>
<tr><td>
        <A HREF="1.htm" target="data">连接页面1</A><BR>
</td></tr><tr><td>
        <A HREF="2.htm" target="data">连接页面2</A><BR>
</td></tr><tr><td>
 <A HREF="3.htm" target="data">连接页面3</A><BR>
</td></tr><tr><td>
 <A HREF="4.htm" target="data">连接页面4</A>
</td></tr></table>
</DIV>

<!-- </BLOCKQUOTE> -->
<!--下方全部展开/关闭-->
<DIV ID="elExpParent" CLASS=regular> <A HREF="#" onClick="expandAll(true); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0 ALT="展开/关闭全部">展开/关闭全部</A> </DIV>

<!---------- end OUTLINE ----------->

<br>

<SCRIPT LANGUAGE="JavaScript1.2">
<!--
if(NS4){
  firstEl = "elOneParent";
  firstInd = getIndex(firstEl);
  showAll();
  arrange();
}
//-->
</SCRIPT>


效果图如下:

树形菜单

展开或关闭全部菜单展开/关闭全部  

 

 

责任编辑:王眉
发表评论  打印本文  推荐本文  加入收藏  返回顶部  关闭窗口
  • 上一篇: 网络营销战略分析
  • 下一篇: 微软将投16亿美元与谷歌斗法
  • □ 最新文章
    精华文章  自助建站网站设计应从运营和... 08-27
    精华文章  企业自助建站怎样才能发展快 08-23
    精华文章  自助建站网页优化技巧 08-22
    精华文章  如何让你的自助建站更完善 08-20
    精华文章  个人自助建站,了解自己比了... 08-17
    精华文章  自助建站应该注意的几大原则 08-13
    精华文章  自助建站的可视化设计原则 08-03
    精华文章  针对网络营销的自助建站技巧 08-02
    精华文章  谈谈自助建站的个性化设计 07-30
    精华文章  自助建站规划产品前我们应该... 07-27
    □ 推荐文章
    精华文章  自助建站网站设计应从运营和... 08-27
    精华文章  企业自助建站怎样才能发展快 08-23
    精华文章  自助建站网页优化技巧 08-22
    精华文章  如何让你的自助建站更完善 08-20
    精华文章  个人自助建站,了解自己比了... 08-17
    精华文章  自助建站应该注意的几大原则 08-13
    精华文章  自助建站的可视化设计原则 08-03
    精华文章  针对网络营销的自助建站技巧 08-02
    精华文章  谈谈自助建站的个性化设计 07-30
    精华文章  自助建站规划产品前我们应该... 07-27
    □ 热点文章
    精华文章  怎样做网页的一些经验体会 03-29
    精华文章  树形菜单原码 06-06
    普通文章  怎样建一个自助商业网站 04-10
    精华文章  网站建设过程的简单叙述 06-14
    精华文章  网页布局类型 05-16
    精华文章  做自助网站最难的是什么 03-19
    普通文章  中小企业网站建设的一些技巧 02-08
    精华文章  自助建站用户如何插入FLASH... 09-20
    精华文章  自助建站为何有时行距过大? 08-01
    精华文章  个性风格的自助网站头部是怎... 01-24
    ·关于我们·联系方式·网站商务通·如何建网站·如何制作网页·怎么做网站·友情链接·购买流程·付款方式·付款通知