DIV+CSS構成的樹型菜單

這是用DIV+CSS+JS構成的樹型菜單，採用列表,符合WEB標準，在大多數WIN瀏覽器下，相容性不錯，xhtml見效果頁,我現在做的是二個菜單,如果需要添加,可把<ul class="collapsed" id="submenuid2">......</ul>之間的內容加上去,"submenuid"加1,查看效果。

CSS代碼

body {margin: 0px;padding: 0;font: 12px " Arial, Helvetica, sans-serif;background: #FFFFFF;text-align: center;}ul{margin: 0;padding: 0;list-style: none;}#treenav {margin: 10px;text-align: left;}#treenav ul li {margin: 1px 0;padding: 0;font-size: 11px;}#treenav ul.expanded {display: block;}#treenav ul.expanded,#treenav ul.collapsed {margin: 5px 10px;}#treenav ul.collapsed {display: none;}.expanded li,.collapsed li{border-bottom: 1px dashed #CCCCCC;width: 100px;}.listhead {font-weight: bold;display: block;font-size: 12px;color: #333333;background: #F1F1F1;padding: 3px;width: 120px;margin: 1px 0;}#treenav a {text-decoration: none;color: #666666;}#treenav a:hover {color: #990000;}

JS代碼

function toggleMenu(id){
element = document.getElementById(id);
element.className = (element.className.toLowerCase() == 'expanded'?'collapsed':'expanded');
}
onload = function() {
toggleMenu('submenuid');
}