|
|
马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。
您需要 登录 才可以下载或查看，没有帐号？立即注册
x
最后你还得知道，你所用的工具，你可能认为Dreamweaver很好，没错，它的确不错，但你要认识到，当你熟练使用了这门技术，你就可以在任何文本编辑器中编写网页，甚至在记事本中。
二级菜单，不管睁开几个栏目，革新不影响，原作中#navli的背景致和背景图片分隔写了，形成背景致不失效，自己已修改！
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/><title>DIV+CSS+JS二级树型菜单，睁开后革新无影响</title><styletype="text/css"><!--body{font-family:arial,宋体,serif;font-size:12px;}*{margin:0px;padding:0px;}#nav{width:174px;line-height:24px;list-style-type:none;text-align:left;/*界说全部ul菜单的行高和背景致*/}/*==================一级目次===================*/#nava{width:174px;display:block;padding-left:20px;/*Width(必定要)，不然上面的Li会变形*/}#navli{border-bottom:#FFF1pxsolid;/*上面的一条白边*/float:left;background-color:#FECFD6;color:#DD1336;font-weight:bold;}#navlia:hover{background:#F85B78;/*一级目次onMouseOver显现的背景致*/}#nava:link{color:#DD1336;text-decoration:none;}#nava:visited{color:#DD1336;text-decoration:none;}#nava:hover{color:#FFF;text-decoration:none;font-weight:bold;}/*==================二级目次===================*/#navliul{list-style:none;text-align:left;}#navliulli{background:#ffecef;/*二级目次的背景致*/font-weight:normal;}#navliula{padding-left:20px;width:174px;/*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:#FFAA1C;/*二级onmou搜索引擎优化ver的字体色彩、背景致*/}/*==============================*/#navli:hoverul{left:auto;}#navli.sfhoverul{left:auto;}#content{clear:left;}#navul.collapsed{display:none;}-->#PARENT{width:174px;}</style></head><body><divid="PARENT"><ulid="nav"><li><ahref="#Menu=ChildMenu1"onClick="DoMenu(ChildMenu1)">菜单一</a><ulid="ChildMenu1"class="collapsed"><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li><li><ahref=##Menu=ChildMenu1>菜单一</a></li></ul></li><li><ahref="#Menu=ChildMenu2"onClick="DoMenu(ChildMenu2)">菜单二</a><ulid="ChildMenu2"class="collapsed"><li><ahref=##Menu=ChildMenu2>菜单二</a></li><li><ahref=##Menu=ChildMenu2>菜单二</a></li><li><ahref=##Menu=ChildMenu2>菜单二</a></li><li><ahref=##Menu=ChildMenu2>菜单二</a></li><li><ahref=##Menu=ChildMenu2>菜单二</a></li></ul></li><li><ahref="#Menu=ChildMenu3"onClick="DoMenu(ChildMenu3)">菜单三</a><ulid="ChildMenu3"class="collapsed"><li><ahref=##Menu=ChildMenu3>菜单三</a></li><li><ahref=##Menu=ChildMenu3>菜单三</a></li><li><ahref=##Menu=ChildMenu3>菜单三</a></li><li><ahref=##Menu=ChildMenu3>菜单三</a></li><li><ahref=##Menu=ChildMenu3>菜单三</a></li><li><ahref=##Menu=ChildMenu3>菜单三</a></li></ul></li><li><ahref="#Menu=ChildMenu4"onClick="DoMenu(ChildMenu4)">菜单四</a><ulid="ChildMenu4"class="collapsed"><li><ahref=##Menu=ChildMenu4>菜单四</a></li><li><ahref=#Menu=ChildMenu4>菜单四</a></li><li><ahref=##Menu=ChildMenu4>菜单四</a></li><li><ahref=##Menu=ChildMenu4>菜单四</a></li><li><ahref=##Menu=ChildMenu4>菜单四</a></li><li><ahref=##Menu=ChildMenu4>菜单四</a></li></ul></li><li><ahref="#Menu=ChildMenu5"onClick="DoMenu(ChildMenu5)">菜单五</a><ulid="ChildMenu5"class="collapsed"><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=#C#Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li><li><ahref=##Menu=ChildMenu5>菜单五</a></li></ul></li><li><ahref="#Menu=ChildMenu6"onClick="DoMenu(ChildMenu6)">菜单六</a><ulid="ChildMenu6"class="collapsed"><li><ahref=##Menu=ChildMenu6>菜单六</a></li><li><ahref=##Menu=ChildMenu6>菜单六</a></li><li><ahref=##Menu=ChildMenu6>菜单六</a></li></ul></li><li><ahref="#Menu=ChildMenu7"onClick="DoMenu(ChildMenu7)">菜单七</a><ulid="ChildMenu7"class="collapsed"><li><ahref=##Menu=ChildMenu7>菜单七</a></li><li><ahref=##Menu=ChildMenu7>菜单七</a></li></ul></li><li><ahref="#Menu=ChildMenu8"onClick="DoMenu(ChildMenu8)">菜单八</a><ulid="ChildMenu8"class="collapsed"><li><ahref=##Menu=ChildMenu8>菜单八</a></li><li><ahref=##Menu=ChildMenu8>菜单八</a></li><li><ahref=##Menu=ChildMenu8>菜单八</a></li></ul></li><li><ahref="#Menu=ChildMenu9"onClick="DoMenu(ChildMenu9)">菜单九</a><ulid="ChildMenu9"class="collapsed"><li><ahref=##Menu=ChildMenu9>菜单九</a></li><li><ahref=##Menu=ChildMenu9>菜单九</a></li><li><ahref=##Menu=ChildMenu9>菜单九</a></li></ul></li><li><ahref="#Menu=ChildMenu10"onClick="DoMenu(ChildMenu10)">菜单十</a><ulid="ChildMenu10"class="collapsed"><li><ahref=##Menu=ChildMenu10>菜单十</a></li></ul></li></ul></div><scripttype=text/javascript><!--varLastLeftID="";functionmenuFix(){varobj=document.getElementById("nav").getElementsByTagName("li");for(vari=0;i<obj.length;i++){obj.onmou搜索引擎优化ver=function(){this.className+=(this.className.length>0?"":"")+"sfhover";}obj.onMouseDown=function(){this.className+=(this.className.length>0?"":"")+"sfhover";}obj.onMouseUp=function(){this.className+=(this.className.length>0?"":"")+"sfhover";}obj.onmou搜索引擎优化ut=function(){this.className=this.className.replace(newRegExp("(?|^)sfhover"),"");}}}functionDoMenu(emid){varobj=document.getElementById(emid);obj.className=(obj.className.toLowerCase()=="expanded"?"collapsed":"expanded");if((LastLeftID!="")&&(emid!=LastLeftID))//封闭上一个Menu{document.getElementById(LastLeftID).className="collapsed";}LastLeftID=emid;}functionGetMenuID(){varMenuID="";var_paramStr=newString(window.location.href);var_sharpPos=_paramStr.indexOf("#");if(_sharpPos>=0&&_sharpPos<_paramStr.length-1){_paramStr=_paramStr.substring(_sharpPos+1,_paramStr.length);}else{_paramStr="";}if(_paramStr.length>0){var_paramArr=_paramStr.split("&");if(_paramArr.length>0){var_paramKeyVal=_paramArr[0].split("=");if(_paramKeyVal.length>0){MenuID=_paramKeyVal[1];}}/*if(_paramArr.length>0){var_arr=newArray(_paramArr.length);}//取一切#前面的，菜单只需用到Menu//for(vari=0;i<_paramArr.length;i++){var_paramKeyVal=_paramArr.split(=);if(_paramKeyVal.length>0){_arr[_paramKeyVal[0]]=_paramKeyVal[1];}}*/}if(MenuID!=""){DoMenu(MenuID)}}GetMenuID();//*这两个function的按次要注重一下，否则在Firefox里GetMenuID()不起效果menuFix();--></script></html>
尺度之路www.ckuyun.com提醒：能够先修正部分代码后再运转
最近在做一个魔术网的div+css切割，昨晚发现了长期以来一直无记录下来的问题！关于兼容IE跟FF的float属性。 |
|
|Archiver|手机版|仓酷云
鄂ICP备14007578号-2
发表于 2015-1-16 10:37:03
收藏
转播
分享
淘帖
顶
踩
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
千斤顶
照妖镜