怎么做出这效果

f286 2003-12-03 08:58:06
我想在左侧的网页中,做出几行菜单,每个都有自己的子菜单当用户典籍的时候就可以,自动显示出来子菜单将下面的结构
开始的状态
aaa
bbb
ccc
ddd
当用户点击aaa的时候
aaa
a1
a2
a3
bbb
ccc
ddd
当用户点击bbb的时候
aaa
bbb
b1
b2
b3
ccc
ddd
依此类推
请大虾把代码贴出来,最好有现成的网页,发给我f286@126.com
...全文
26 7 打赏 收藏 转发到动态 举报
写回复
用AI写文章
7 条回复
切换为时间正序
请发表友善的回复…
发表回复
f286 2003-12-04
  • 打赏
  • 举报
回复
谢了,我搞定了!
popcode 2003-12-03
  • 打赏
  • 举报
回复
增加一个层
这里就要加一个
<script>numTotal=3;scores[1]='KB1';scores[2]='KB2';scores[3]='KB3';</script>
比如要4个层:
<div id=KB4Parent><a onClick="expandIt('KB4'); return false" href="#" class=black>
ddd</a></div>
<div class=child id=KB4Child>d1<br/>
d2<br/></div>

<script>numTotal=3;scores[1]='KB1';scores[2]='KB2';scores[3]='KB3';scores[4]='KB4';</script>
f286 2003-12-03
  • 打赏
  • 举报
回复
请问我为什么不能够修改,一修改子菜单就不会自动出来??
popcode 2003-12-03
  • 打赏
  • 举报
回复
</head>
<body oncontextmenu=self.event.returnValue=false>
<table cellspacing=0 cellpadding=0 width=120 border=0>
<tbody><tr><td><div id=KB1Parent>

<a onClick="expandIt('KB1'); return false" href="#" class=black>
aaa</a></div>
<div class=child id=KB1Child>a1<br>
a2<br></div>

<div id=KB2Parent><a onClick="expandIt('KB2'); return false" href="#" class=black>
bbbb</a></div>
<div class=child id=KB2Child>b1<br>
b2<br>
b3</div>

<div id=KB3Parent><a onClick="expandIt('KB3'); return false" href="#" class=black>
ccc</a></div>
<div class=child id=KB3Child>c1<br>
c2<br></div>


<script>numTotal=3;scores[1]='KB1';scores[2]='KB2';scores[3]='KB3';</script>
</td>
</tr>
</tbody>
</table>
</body>

</html>
DeltaCat 2003-12-03
  • 打赏
  • 举报
回复
CSDN 论坛首页的 左边 不就是?
popcode 2003-12-03
  • 打赏
  • 举报
回复
<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>
popcode 2003-12-03
  • 打赏
  • 举报
回复
<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style type="text/css">
A:active { TEXT-DECORATION: none}
A:visited { TEXT-DECORATION: none}
A:hover { COLOR: #FF0000;TEXT-DECORATION: none}
A:link { TEXT-DECORATION: none}
body { FONT-FAMILY: "MS Shell Dlg", "Tahoma", "sans-serif"; font-size: 10pt; COLOR: 000000; ; text-decoration: none}
tr { FONT-FAMILY: MS Shell Dlg, Tahoma,sans-serif; font-size: 10pt; }
td { FONT-FAMILY: MS Shell Dlg,Tahoma, sans-serif; FONT-SIZE: 10pt; FONT-WEIGHT: normal}
form {FONT-FAMILY: MS Shell Dlg,tahoma,宋体; FONT-SIZE: 10pt}
.black { color: #000000; font-size: 10pt; }
.white { color: #ffffff; font-size: 9pt; }
.red { color: #ff0000; font-size: 9pt; }
.green { color: #009900; font-size: 9pt; }
.c990000 { color: #990000; font-size: 9pt; }
.cFF9900 { color: #FF9900; font-size: 9pt; }
.c333399 { color: #333399; font-size: 9pt; }
.blue { color: #0000FF; font-size: 9pt; }
.blue1 { color: #3300cc; font-size: 9pt; }
.gray { color: #666666; font-size: 9pt; }
.row {line-height: 15pt}
.bottom { BACKGROUND-COLOR: #CCCCCC; BORDER-BOTTOM: #665b8e 1px solid; BORDER-LEFT: #ffffff 1px solid; BORDER-RIGHT: #665b8e 1px solid; BORDER-TOP: #ffffff 1px solid; COLOR: #000000; FONT-FAMILY: "宋体"; HEIGHT: 18px; font-size: 10pt}
.editbox1 { BACKGROUND-COLOR: #DBDBDB; COLOR: #000000; FONT-FAMILY: 宋体; HEIGHT: 18px; font-size: 10pt}
.editbox3 { BACKGROUND-COLOR: #FFFFFF; COLOR: #000000; FONT-FAMILY: 宋体; HEIGHT: 18px; font-size: 10pt}
.editbox2 { COLOR: #000000; CURSOR: text; FONT-SIZE: 10pt; PADDING-BOTTOM: 1px; PADDING-LEFT: 1px; PADDING-RIGHT: 1px; PADDING-TOP: 1px; background-color: #DBDBDB; FONT-FAMILY: 宋体}
.size { font-size: 9px; font-family: "Verdana", "Arial", "Helvetica", "sans-serif"}
A.yellow:active { TEXT-DECORATION: none; color: #FFFFFF}
A.yellow:visited { TEXT-DECORATION: none; color: #FFFFFF}
A.yellow:link { COLOR:ffffff;TEXT-DECORATION: none}
A.yellow:hover {COLOR: #FFff33; TEXT-DECORATION: none}
</style>

87,904

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧