有没有动态的导航菜单多层的.小弟要.
最好是左边的.像这个CSDN一样的显示导航栏.对整个网页没影响的.谢谢兄弟们了! 问题点数:0、回复次数:6Top
1 楼butcher2002(我又出来捣乱了)回复于 2004-09-03 20:25:17 得分 0
<!--第一步:把如下代码加入到<head>区域中-->
<style>
body,td,a {font-size:9pt;color:black;text-decoration:none}
.normal {padding:2px}
.up {padding:1px;border:#999999 1px solid;background:#cccccc}
.down {padding:1px;border:dbdbdb 1px solid;background:dbdbdb}
.menuv {filter: revealTrans(transition=23,duration=0.5);padding:2px}
</style>
<!--第二步:把如下代码加入到<body>区域中-->
<script>
//闪烁的表格边框
function flashit(){if(!document.all)return;if (td123.style.borderColor=="black")td123.style.borderColor="#999999";else td123.style.borderColor="black"}setInterval("flashit()",500)
//渐入的效果,改变alpha值
function high(image){theobject=image,highlighting=setInterval("highlightit(theobject)",100)}function low(image){clearInterval(highlighting),image.filters.alpha.opacity=50}function highlightit(cur2){if (cur2.filters.alpha.opacity<100)cur2.filters.alpha.opacity+=20;else if(window.highlighting)clearInterval (highlighting)}
//拖动层的js
var over=false,down=false,divleft,divtop;function move(){if(down){plane.style.left=event.clientX-divleft;plane.style.top=event.clientY-divtop;}}
//滑动层
function bodyload()
{
if(plane.style.pixelTop!=0)
{
plane.style.pixelTop-=10
setTimeout('bodyload()',1)
}
}
//渐变显示层
function Show(divid) {
divid.filters.revealTrans.apply();
divid.style.visibility = "visible";
divid.filters.revealTrans.play();
}
function Hide(divid) {
divid.filters.revealTrans.apply();
divid.style.visibility = "hidden";
divid.filters.revealTrans.play();
}
</script>
<div style="position:absolute;z-index:1;width:1;height:1; left: 0; top: 500" ID=plane onmousedown="down=true;divleft=event.clientX-parseInt(plane.style.left);divtop=event.clientY-parseInt(plane.style.top)" onmouseup="down=false">
<table id="td123" cellspacing=2 width=100 border=0 style="BORDER:#999999 1px solid;cursor:hand" cellpadding="0" bgcolor="f4f4f4">
<tr>
<td bgcolor="#cccccc" height="20" style="BORDER:#999999 1px solid;cursor:move">
<div align="center">多级滑动菜单</div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this),Show(menu1)
" onMouseOut="this.className='normal',low(this),menu1.style.visibility='hidden'" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'" >
<div align="right">有下级菜单>></div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this),Show(menu2)" onMouseOut="this.className='normal',low(this),menu2.style.visibility='hidden'" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'" >
<div align="right">有下级菜单>></div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align="right">无下级菜单>></div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align="right">无下级菜单>></div>
</td>
</tr>
</table>
<div id="menu1" style="position:absolute;top:24px;left:96px; z-index:1; visibility: hidden; width: 105"
onMouseOver=this.style.visibility='visible'
onMouseOut=this.style.visibility='hidden' class="menuv">
<table cellspacing=2 width=100 border=0 style="BORDER:#999999 1px solid;cursor:hand" cellpadding="0" bgcolor="f4f4f4" align="right">
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align="center">子菜单</div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align=center>子菜单</div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align=center>子菜单</div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align=center>子菜单</div>
</td>
</tr>
</table>
</div>
<div id="menu2" style="position:absolute;top:45px;left:96; z-index:1; visibility: hidden; width: 105"
onMouseOver=this.style.visibility='visible'
onMouseOut=this.style.visibility='hidden' class="menuv">
<table cellspacing=2 width=100 border=0 style="BORDER:#999999 1px solid;cursor:hand" cellpadding="0" bgcolor="f4f4f4" align="right">
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align="center">子菜单</div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align=center>子菜单</div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align=center>子菜单</div>
</td>
</tr>
<tr>
<td class=normal onMouseDown="this.className='down'"
onMouseOver="this.className='up',high(this)" onMouseOut="this.className='normal',low(this)" style="filter:alpha(opacity=50)"onMouseUp="this.className='up'">
<div align=center>子菜单</div>
</td>
</tr>
</table>
</div>
</div>
<!--第三步:把“onmousemove="move()" onload=bodyload()”加在<body>标记里-->
<!--例如:-->
<body onmousemove="move()" onload=bodyload()>Top
2 楼butcher2002(我又出来捣乱了)回复于 2004-09-03 20:28:12 得分 0
这个也不错~
<script language="JavaScript1.2">
scores = new Array(20);var numTotal=0;NS4 = (document.layers) ? 1 : 0;IE4 = (document.all) ? 1 : 0;ver4 = (NS4 || IE4) ? 1 : 0;if (ver4) { with (document) { write("<STYLE TYPE='text/css'>"); if (NS4) { write(".parent {position:absolute; visibility:visible}"); write(".child {position:absolute; visibility:visible}"); write(".regular {position:absolute; visibility:visible}") } else { write(".child {display:none}") } write("</STYLE>"); }}function getIndex(el) { ind = null; for (i=0; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.id == el) { ind = i; break; } } return ind;}function arrange() { nextY = document.layers[firstInd].pageY +document.layers[firstInd].document.height; for (i=firstInd+1; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.visibility != "hide") { whichEl.pageY = nextY; nextY += whichEl.document.height; } }}function initIt(){ if (!ver4) return; if (NS4) { for (i=0; i<document.layers.length; i++) { whichEl = document.layers[i]; if (whichEl.id.indexOf("Child") != -1) whichEl.visibility = "hide"; } arrange(); } else { divColl = document.all.tags("DIV"); for (i=0; i<divColl.length; i++) { whichEl = divColl(i); if (whichEl.className == "child") whichEl.style.display = "none"; } }}function expandIt(el) { if (!ver4) return; if (IE4) { whichEl1 = eval(el + "Child"); for(i=1;i<=numTotal;i++){ whichEl = eval(scores[i] + "Child"); if(whichEl!=whichEl1) { whichEl.style.display = "none"; } } whichEl1 = eval(el + "Child"); if (whichEl1.style.display == "none") { whichEl1.style.display = "block"; } else { whichEl1.style.display = "none"; } } else { whichEl = eval("document." + el + "Child"); for(i=1;i<=numTotal;i++){ whichEl = eval("document." + scores[i] + "Child"); if(whichEl!=whichEl1) { whichEl.visibility = "hide"; } } if (whichEl.visibility == "hide") { whichEl.visibility = "show"; } else { whichEl.visibility = "hide"; } arrange(); }}onload = initIt;
</script>
</head>
<body>
<!--第二步:把如下代码加入<body>区域中//-->
<div id='KB1Parent' class='parent'><a href="#" onClick="expandIt('KB1'); return false">
<IMG SRC="1.gif" BORDER=0>时间日期类</a></div><div id='KB1Child' class='child'>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>任意位置显示时钟</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>倒计时代码生成器</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>八种风格时间显示</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>显示登陆时间</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>日历生成器</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>退出显示访问时间</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>一款特酷的时钟</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>全中文日期显示</a></div>
<div id='KB2Parent' class='parent'><a href="#" onClick="expandIt('KB2'); return false">
<IMG SRC="1.gif" BORDER=0>页面导航类</a></div><div id='KB2Child' class='child'>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>显示站点信息导航</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>任意显示导航信息</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>动态导航脚本</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>下拉式导航菜单</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>静止导航菜单</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>静止图片脚本</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>文本静止不动</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>信息框显示链接</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>友情链接导航框</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>目录式导航菜单</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>重要信息说明脚本</a>
</div>
<div id='KB3Parent' class='parent'><a href="#" onClick="expandIt('KB3'); return false">
<IMG SRC="1.gif" BORDER=0>页面背景类</a></div><div id='KB3Child' class='child'>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>背景向下移动</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>背景不停变换色彩</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>使页面产生百叶窗</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>颜色代码英文集</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>自已选择背景颜色</a><br>
<a href="#" target="_target"> <IMG SRC="2.gif" BORDER=0>背景颜色安全测试</a><br>
<a href="#" target='_target'> <IMG SRC="2.gif" BORDER=0>颜色选择器</a><br>
</div>
<SCRIPT>numTotal=4;scores[1]='KB1';scores[2]='KB1';scores[3]='KB2';scores[4]='KB3'; //numtotal是共多少个下拉菜单
</SCRIPT>Top
3 楼xian567(于连)回复于 2004-09-03 20:34:22 得分 0
有没有层次多的啊!Top
4 楼liuxiaoyi666(MSMVP 小猪妹荣誉马甲之八卦兔子)回复于 2004-09-03 20:35:36 得分 0
你down阿信的吧Top
5 楼xian567(于连)回复于 2004-09-03 20:39:54 得分 0
?Top
6 楼dsclub(任搏软)回复于 2004-09-03 20:55:20 得分 0
代码太多了,自己在论坛里搜搜!
这样的问题以后不要发贴了Top




