⭐ 欢迎来到虫虫下载站！ | 📦 资源下载 📁 资源专辑 ℹ️ 关于我们
⭐ 虫虫下载站
📤 上传资源

📄 menu3.htm

📁 javascript各种效果的实例及源代码
💻 HTM
字号:
🔍 
<html>
<head>
<title>树形菜单(三)</title>
<style type="text/css">
<!--
body {  font-family: "宋体"; font-size: 9pt; margin-top: 0px; margin-left: 4px; margin-right: 0px}
A { COLOR: black; FONT-SIZE: 9pt; FONT-WEIGHT: 400; TEXT-DECORATION: none }
 A:hover { COLOR: red; FONT-SIZE: 9pt; FONT-WEIGHT: 400; TEXT-DECORATION: underline }
a:active     { font: 9pt "宋体"; cursor: hand; color: #FF0033 }
--></style>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<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=\"rsmenu1.js\"></SCR"+"IPT>");
}
//-->
</SCRIPT>
</head>
<body bgcolor="#fef4d9">
<br>
<br>
<center><font color=red face="隶书" size=6>树形菜单(三)</font></center>
<br>
<center>
<table border=5 bordercolor=blue borderlight=green>
<tr><td align=center><font size=5 color=red face="Arial, Helvetica, sans-serif"><strong>下面为脚本显示区</strong></font></td></tr><tr><td align=center><!---------- 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>


<!-- 第四级父菜单 -->
<DIV ID="elFourParent" CLASS=parent style="margin-left: 0.5em">
<A HREF="#" style="color:#C000FF; text-decoration:none;" onClick="expandIt('elFour'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0>主菜单四</A>
</DIV>

<!-- 第四级子菜单 -->
<DIV ID="elFourChild" 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="elFiveParent" CLASS=parent style="margin-left: 0.5em">
<A HREF="#" style="color:#C000FF; text-decoration:none;" onClick="expandIt('elFive'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0>主菜单五</A>
</DIV>

<!-- 第五级子菜单 -->
<DIV ID="elFiveChild" 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>


<!-- </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="展开/关闭全部"> 
  <FONT COLOR="#008000">全部菜单</FONT></A> </DIV>

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

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

</td></tr></table>
<br>
请下载<a href=rsmenu1.js>rsmenu1.js</a>脚本
</center>
<br>
<br>
<center>
<textarea name=source rows=12 cols=55 class=yk9>
脚本说明:
第一步:把如下代码加入<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=\"rsmenu1.js\"></SCR"+"IPT>");
}
//-->
</SCRIPT>

第二步:把如下代码加入<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>


<!-- 第四级父菜单 -->
<DIV ID="elFourParent" CLASS=parent style="margin-left: 0.5em">
<A HREF="#" style="color:#C000FF; text-decoration:none;" onClick="expandIt('elFour'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0>主菜单四</A>
</DIV>

<!-- 第四级子菜单 -->
<DIV ID="elFourChild" 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="elFiveParent" CLASS=parent style="margin-left: 0.5em">
<A HREF="#" style="color:#C000FF; text-decoration:none;" onClick="expandIt('elFive'); return false"><IMG NAME="imEx" SRC="bullet-plus.gif" WIDTH=9 HEIGHT=9 BORDER=0>主菜单五</A>
</DIV>

<!-- 第五级子菜单 -->
<DIV ID="elFiveChild" 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>


<!-- </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="展开/关闭全部"> 
  <FONT COLOR="#008000">全部菜单</FONT></A> </DIV>

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

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

</textarea>
<SCRIPT LANGUAGE="JavaScript">

<!-- hide

function goHist(a) 

{

   history.go(a);

}

//-->

</script>

<FORM METHOD="post">
<INPUT TYPE="button" VALUE="返回" onClick="goHist(-1)" style="background-color: #8000FF; color: rgb(255,255,255)">
</form>
</center>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
</body>
</html>

⌨️ 快捷键说明

复制代码 Ctrl + C
搜索代码 Ctrl + F
全屏模式 F11
切换主题 Ctrl + Shift + D
显示快捷键 ?
增大字号 Ctrl + =
减小字号 Ctrl + -