DIV+CSS+JS树形菜单,可以刷新不改变菜单

<! DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< meta http-equiv ="Content-Type" content ="text/html;charset=gb2312" >
< title > Div+CSS+JS树型菜单，可刷新 </ title >
< meta name ="description" content ="http://www.NETAny.net" >
< style type ="text/css" > ...
<!--
*{...}{margin:0;padding:0;border:0;}
body{...}{
font-family:arial,宋体,serif;
font-size:12px;
}
#nav{...}{
width:180px;
line-height:24px;
list-style-type:none;
text-align:left;
/**//*定义整个ul菜单的行高和背景色*/
}

/**//*==================一级目录===================*/
#nava{...}{
width:160px;
display:block;
padding-left:20px;
/**//*Width(一定要)，否则下面的Li会变形*/
}

#navli{...}{
background:#CCC;/**//*一级目录的背景色*/
border-bottom:#FFF1pxsolid;/**//*下面的一条白边*/
float:left;
/**//*float：left,本不应该设置，但由于在Firefox不能正常显示
继承Nav的width,限制宽度，li自动向下延伸*/
}

#navlia:hover{...}{
background:#CC0000;/**//*一级目录onMouseOver显示的背景色*/
}

#nava:link{...}{
color:#666;text-decoration:none;
}
#nava:visited{...}{
color:#666;text-decoration:none;
}
#nava:hover{...}{
color:#FFF;text-decoration:none;font-weight:bold;
}

/**//*==================二级目录===================*/
#navliul{...}{
list-style:none;
text-align:left;
}
#navliulli{...}{
background:#EBEBEB;/**//*二级目录的背景色*/
}

#navliula{...}{
padding-left:20px;
width:160px;
/**//*padding-left二级目录中文字向右移动，但Width必须重新设置=(总宽度-padding-left)*/
}

/**//*下面是二级目录的链接样式*/

#navliula:link{...}{
color:#666;text-decoration:none;
}
#navliula:visited{...}{
color:#666;text-decoration:none;
}
#navliula:hover{...}{
color:#F3F3F3;
text-decoration:none;
font-weight:normal;
background:#CC0000;
/**//*二级onmouseover的字体颜色、背景色*/
}

/**//*==============================*/
#navli:hoverul{...}{
left:auto;
}
#navli.sfhoverul{...}{
left:auto;
}
#content{...}{
clear:left;
}
#navul.collapsed{...}{
display:none;
}
-->

#PARENT{...}{
width:300px;
padding-left:20px;
}
</ style >
</ head >

< body >
< div id ="PARENT" >
< ul id ="nav" >
< li >< a href ="#Menu=ChildMenu1" onclick ="DoMenu('ChildMenu1')" > 我的网站 </ a >
< ul id ="ChildMenu1" class ="collapsed" >
< li >< a href ="http://www.netany.net" target ="_blank" > www.netany.net </ a ></ li >
< li >< a href ="http://www.netany.net" target ="_blank" > www.netany.net </ a ></ li >
< li >< a href ="http://www.netany.net" target ="_blank" > www.netany.net </ a ></ li >
</ ul >
</ li >
< li >< a href ="#Menu=ChildMenu2" onclick ="DoMenu('ChildMenu2')" > 我的帐务 </ a >
< ul id ="ChildMenu2" class ="collapsed" >
< a href ="http://www.netany.net" target ="_blank" > 支付 </ a ></ li >
< li >< a href ="#" > 网上支付 </ a ></ li >
< li >< a href ="#" > 登记汇款 </ a ></ li >
< li >< a href ="#" > 在线招领 </ a ></ li >
< li >< a href ="#" > 历史帐务 </ a ></ li >
</ ul >
</ li >
< li >< a href ="#Menu=ChildMenu3" onclick ="DoMenu('ChildMenu3')" > 网站管理 </ a >
< ul id ="ChildMenu3" class ="collapsed" >
< li >< a href ="#" > 登录 </ a ></ li >
< a href ="http://www.netany.net" target ="_blank" > 管理 </ a ></ li >
< li >< a href ="#" > 管理 </ a ></ li >
< li >< a href ="#" > 管理 </ a ></ li >
</ ul >
</ li >
< li >< a href color: #0000ff;

分享到：

中文编码问题全面分析 | 上周技术关注：内置.NET FX 3.0和IIS7的Wi ...

• 2006-11-13 22:12
• 浏览 1073
• 评论(0)
• 相关推荐

评论

发表评论

您还没有登录,请您登录后再发表评论