联级菜单问题
<HEAD>
<TITLE> New Document </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<style>
a {
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#666;
text-decoration:none;
}
a:hover {
color:#F90;
text-decoration:underline;
}
a:vistied {
color:#666;
text-decoration:none;
}
#tree li {
color:#666;
font-size:10px;
font-family:Arial, Helvetica, sans-serif;
line-height:180%;
list-style:none;
}
#tree ul {
margin-left:16px;
padding-left:0px;
display:none;
}
</style>
<script type="text/javascript">
var lastSubMenuID;
//记录最后点击的子菜单
function doRecord(subMenuID) {
document.getElementById(subMenuID).style.display = "none";
lastSubMenuID = subMenuID;
}
//隐藏子菜单
function hideLastSubMenu() {
if(lastSubMenuID == undefined || lastSubMenuID == "") {
return;
} else {
var lastSubMenu = document.getElementById(lastSubMenuID);
lastSubMenu.style.display = "none";
}
}
//显示子菜单
function showSubMenu(subMenuID) {
if(lastSubMenuID == subMenuID) {
if(document.getElementById(lastSubMenuID).style.display == "block") {
document.getElementById(lastSubMenuID).style.display = "none";
return;
}
}
if(lastSubMenuID == undefined) {
doRecord(subMenuID);
}else{
hideLastSubMenu();
doRecord(subMenuID);
}
changeMenuState(subMenuID);
}
//改变子菜单的样式
function changeMenuState(subMenuID) {
var subMenu = document.getElementById(subMenuID);
//subMenu.style.filter = "progidXImageTransform.Microsoft.Wipe()";
//subMenu.filters[0].apply();
subMenu.style.display = "block";
//subMenu.filters[0].play();
}
</script>
</HEAD>
<BODY>
<ul id="tree">
<li id="mainMenu1">
<a href="#" onClick="showSubMenu('main1SubMenu');">Syringes</a>
<ul id="main1SubMenu">
<li><a href="#" class="link1">Safety Syringes</a></li>
<li><a href="#" class="link1">0.1ml Safety...</a></li>
<li><a href="#" class="link1">0.5ml Safety...</a></li>
</ul>
</li>
<li id="mainMenu2">
<a href="#" onClick="showSubMenu('main2SubMenu');">Moulds</a>
<ul id="main2SubMenu">
<li><a href="#" class="link1">Hot Runner...</a></li>
<li><a href="#" class="link1">Semi-Hot...</a></li>
<li><a href="#" class="link1">Cold Runner...</a></li>
</ul>
</li>
<li id="mainMenu3">
<a href="#" onClick="showSubMenu('main3SubMenu');">Moulds</a>
<ul id="main3SubMenu">
<li><a href="#" alt="联级菜单有关问题" />
请问运行后为什么是树形的？如果要变成横排的该怎么做？ jsp
[解决办法]
#tree ul也需要list-style:none
------解决方案--------------------
CSS呀,给你个教程http://download.csdn.net/detail/tsingheng/4808073
[解决办法]
float:left。然后不需要的时候，clean:left。应该是这样的。我没记错的话。
