类似与QQ的好友/黑名单之类的树型菜单_极品

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> New Document </TITLE>

</HEAD>

<BODY>

if (!document.getElementById)

document.getElementById = function() { return null; }

function initializeMenu(menuId, actuatorId) {

var menu = document.getElementById(menuId);

var actuator = document.getElementById(actuatorId);

if (menu == null || actuator == null) return;

//if (window.opera) return; // I'm too tired

actuator.parentNode.style.backgroundImage = "url(/images/plus.gif)";

actuator.onclick = function() {

var display = menu.style.display;

this.parentNode.style.backgroundImage =

(display == "block") ? "url(/images/plus.gif)" : "url(/images/minus.gif)";

menu.style.display = (display == "block") ? "none" : "block";

return false;

}

window.onload = function() {

initializeMenu("productsMenu", "productsActuator");

initializeMenu("newPhonesMenu", "newPhonesActuator");

initializeMenu("compareMenu", "compareActuator");

}

</script>

<style>

body {

font-family: verdana, helvetica, arial, sans-serif;

}

#mainMenu {

background-color: #EEE;

border: 1px solid #CCC;

color: #000;

width: 203px;

}

#menuList {

margin: 0px;

padding: 10px 0px 10px 15px;

}

li.menubar {

background: url(/images/plus.gif) no-repeat 0em 0.3em;

font-size: 12px;

line-height: 1.5em;

list-style: none outside;

}

.menu, .submenu {

display: none;

margin-left: 15px;

padding: 0px;

}

.menu li, .submenu li {

background: url(/images/square.gif) no-repeat 0em 0.3em;

list-style: none outside;

}

a.actuator {

background-color: transparent;

color: #000;

font-size: 12px;

padding-left: 15px;

text-decoration: none;

}

a.actuator:hover {

text-decoration: underline;

}

.menu li a, .submenu li a {

background-color: transparent;

color: #000;

font-size: 12px;

padding-left: 15px;

text-decoration: none;

}

.menu li a:hover, submenu li a:hover {

/*border-bottom: 1px dashed #000;*/

text-decoration: underline;

}

span.key {

text-decoration: underline;

}

</style>

</head>

<body>

<a href="#" id="productsActuator" class="actuator">图秀地带收藏夹</a>

<li>

</ul>

</li>

<li>

</ul>

</li>

</ul>

</li>

</ul>

</div>

</body>

</BODY>

</HTML>

http://www.wyzzlm.com/bbs/viewthread.php?tid=3371&extra=page%3D1

posted on 2007-03-15 10:20 mbskys 阅读(119) 评论(0) 收藏举报