<html>
<head>
<title> 目录树 </title>
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<style>
#foldheader{cursor:hand; font-weight:bold; list-style-image:url(fold.gif)}
#foldinglist{list-style-image:url(list.gif)}
td{font-size:10.5pt}
</style><script language="javascript1.2">var head = "display:''"
img1 = new Image()
img1.src = "fold.gif"
img2 = new Image()
img2.src = "open.gif"function change(){
if (!document.all)
return
if (event.srcElement.id == "foldheader"){
var srcIndex = event.srcElement.sourceIndex
var nested = document.all[srcIndex+1]
if (nested.style.display == "none"){
nested.style.display = ""
event.srcElement.style.listStyleImage = "url(open.gif)"
}
else {
nested.style.display = "none"
event.srcElement.style.listStyleImage = "url(fold.gif)"
}
}
}
document.onclick = change</script>
</head><body>
<table>
<tr>
<td>
<ul>
<li id="foldheader" style="font-size:10.5pt">科目1</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li id="foldheader" style="font-size:9pt">篇章1</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章2</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章3</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章4</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章5</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章6</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章7</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
</ul>
<li id="foldheader" style="font-size:10.5pt">科目2</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">篇章1</li>
<li style="font-size:9pt">篇章2</li>
<li style="font-size:9pt">篇章3</li>
<li style="font-size:9pt">篇章4</li>
<li style="font-size:9pt">篇章5</li>
<li style="font-size:9pt">篇章6</li>
<li style="font-size:9pt">篇章7</li>
</ul>
<li id="foldheader" style="font-size:10.5pt">科目3</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">篇章1</li>
<li style="font-size:9pt">篇章2</li>
<li style="font-size:9pt">篇章3</li>
<li style="font-size:9pt">篇章4</li>
<li style="font-size:9pt">篇章5</li>
<li style="font-size:9pt">篇章6</li>
<li style="font-size:9pt">篇章7</li>
</ul>
</ul>
</td>
</tr>
</table>
</body>
</html>
'//不知道这样的是否可以,三级目录树型菜单,需要三张小图片,
fold.gif是缩进菜单图标,open.gif是展开菜单图标,list.gif是叶子节点的图标
<head>
<title> 目录树 </title>
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<style>
#foldheader{cursor:hand; font-weight:bold; list-style-image:url(fold.gif)}
#foldinglist{list-style-image:url(list.gif)}
td{font-size:10.5pt}
</style><script language="javascript1.2">var head = "display:''"
img1 = new Image()
img1.src = "fold.gif"
img2 = new Image()
img2.src = "open.gif"function change(){
if (!document.all)
return
if (event.srcElement.id == "foldheader"){
var srcIndex = event.srcElement.sourceIndex
var nested = document.all[srcIndex+1]
if (nested.style.display == "none"){
nested.style.display = ""
event.srcElement.style.listStyleImage = "url(open.gif)"
}
else {
nested.style.display = "none"
event.srcElement.style.listStyleImage = "url(fold.gif)"
}
}
}
document.onclick = change</script>
</head><body>
<table>
<tr>
<td>
<ul>
<li id="foldheader" style="font-size:10.5pt">科目1</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li id="foldheader" style="font-size:9pt">篇章1</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章2</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章3</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章4</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章5</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章6</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
<li id="foldheader" style="font-size:9pt">篇章7</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">章节1</li>
<li style="font-size:9pt">章节2</li>
<li style="font-size:9pt">章节3</li>
<li style="font-size:9pt">章节4</li>
<li style="font-size:9pt">章节5</li>
<li style="font-size:9pt">章节6</li>
</ul>
</ul>
<li id="foldheader" style="font-size:10.5pt">科目2</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">篇章1</li>
<li style="font-size:9pt">篇章2</li>
<li style="font-size:9pt">篇章3</li>
<li style="font-size:9pt">篇章4</li>
<li style="font-size:9pt">篇章5</li>
<li style="font-size:9pt">篇章6</li>
<li style="font-size:9pt">篇章7</li>
</ul>
<li id="foldheader" style="font-size:10.5pt">科目3</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li style="font-size:9pt">篇章1</li>
<li style="font-size:9pt">篇章2</li>
<li style="font-size:9pt">篇章3</li>
<li style="font-size:9pt">篇章4</li>
<li style="font-size:9pt">篇章5</li>
<li style="font-size:9pt">篇章6</li>
<li style="font-size:9pt">篇章7</li>
</ul>
</ul>
</td>
</tr>
</table>
</body>
</html>
'//不知道这样的是否可以,三级目录树型菜单,需要三张小图片,
fold.gif是缩进菜单图标,open.gif是展开菜单图标,list.gif是叶子节点的图标
解决方案 »
免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货