常用的三種樹形菜單(很實(shí)用的).doc

a text-decoration:none; a,a:visited color:#000;background:inherit; body margin:0;padding:20px;font:12px tahoma,宋體,sans-serif; dt font-size:22px;font-weight:bold;margin:0 0 0 15px; dd margin:0 0 0 15px; h4 margin:0;padding:0;font-size:18px;text-align:center; p margin:0;padding:0 0 0 18px; p a,p a:visited color:#00f;background:inherit; /*CNLTreeMenu Start*/ .CNLTreeMenu img.s cursor:pointer;vertical-align:middle; .CNLTreeMenu ul padding:0; .CNLTreeMenu li list-style:none;padding:0; .Closed ul display:none; .Child img.s background:none;cursor:default; #CNLTreeMenu1 ul margin:0 0 0 17px; #CNLTreeMenu1 img.s width:20px;height:15px; #CNLTreeMenu1 .Opened img.s background:url(/effect/images/treemenu/opened1.gif) no-repeat 0 0; #CNLTreeMenu1 .Closed img.s background:url(/effect/images/treemenu/closed1.gif) no-repeat 0 0; #CNLTreeMenu1 .Child img.s background:url(/effect/images/treemenu/child1.gif) no-repeat 3px 5px; #CNLTreeMenu2 ul margin:0 0 0 17px; #CNLTreeMenu2 img.s width:17px;height:15px; #CNLTreeMenu2 .Opened img.s background:url(/effect/images/treemenu/opened2.gif) no-repeat 4px 6px; #CNLTreeMenu2 .Closed img.s background:url(/effect/images/treemenu/closed2.gif) no-repeat 3px 6px; #CNLTreeMenu2 .Child img.s background:url(/effect/images/treemenu/child2.gif) no-repeat 3px 5px; #CNLTreeMenu3 ul margin:0 0 0 17px; #CNLTreeMenu3 img.s width:34px;height:18px; #CNLTreeMenu3 .Opened img.s background:url(/effect/images/treemenu/opened3.gif) no-repeat 0 1px; #CNLTreeMenu3 .Closed img.s background:url(/effect/images/treemenu/closed3.gif) no-repeat 0 1px; #CNLTreeMenu3 .Child img.s background:url(/effect/images/treemenu/child3.gif) no-repeat 13px 2px; /*CNLTreeMenu End*/ /*Temp CSS for View Demo*/ #CNLTreeMenu1,#CNLTreeMenu2,#CNLTreeMenu3 float:left;width:249px;border:1px solid #99BEEF;background:#D2E4FC;color:inherit;margin:3px;padding:3px; #CNLTreeMenu1,#CNLTreeMenu2 padding-bottom:15px; .ViewCode clear:both;border:1px solid #FFB900;background:#FFFFCC;color:inherit;margin:3px;padding:3px; .ViewCode h6 color:#00f; 無(wú)限級(jí)樹形菜單- java中文網(wǎng):www.javaweb.cc CNL Tree Menu1 全部展開& lt;/a全部折疊 Zzsky.Cn 技術(shù)區(qū) 網(wǎng)頁(yè)技術(shù) JavaScript HTML/XHTML/CSS Ajax 網(wǎng)頁(yè)制作工具 設(shè)計(jì)/圖形 Flash/多媒體 VML/Web3D Web編程 Java .Net ASP/VBScript PHP Perl/Python Web綜合/開源 數(shù)據(jù)庫(kù) Access/SQLServer MySQL/PostgreSQL Oracle/DB2/Sybase 服務(wù)器 Windows/IIS Unix/Linux/Apache 應(yīng)用服務(wù)器 二級(jí)目錄 三級(jí)目錄 四級(jí)目錄 五級(jí)目錄 . 第n級(jí)目錄 葉結(jié)點(diǎn)1 葉結(jié)點(diǎn)2 葉結(jié)點(diǎn)3 二級(jí)目錄 三級(jí)目錄 四級(jí)目錄 五級(jí)目錄 . 第n級(jí)目錄 葉結(jié)點(diǎn)1 葉結(jié)點(diǎn)2 葉結(jié)點(diǎn)3 CNL Tree Menu2 全部展開& lt;/a全部折疊 Zzsky.Cn 技術(shù)區(qū) 網(wǎng)頁(yè)技術(shù) JavaScript HTML/XHTML/CSS Ajax 網(wǎng)頁(yè)制作工具 設(shè)計(jì)/圖形 Flash/多媒體 VML/Web3D Web編程 Java .Net ASP/VBScript PHP Perl/Python Web綜合/開源 數(shù)據(jù)庫(kù) Access/SQLServer MySQL/PostgreSQL Oracle/DB2/Sybase 服務(wù)器 Windows/IIS Unix/Linux/Apache 應(yīng)用服務(wù)器 二級(jí)目錄 三級(jí)目錄 四級(jí)目錄 五級(jí)目錄 . 第n級(jí)目錄 葉結(jié)點(diǎn)1 葉結(jié)點(diǎn)2 葉結(jié)點(diǎn)3 二級(jí)目錄 三級(jí)目錄 四級(jí)目錄 五級(jí)目錄 . 第n級(jí)目錄 葉結(jié)點(diǎn)1 葉結(jié)點(diǎn)2 葉結(jié)點(diǎn)3 CNL Tree Menu3 全部展開& lt;/a全部折疊 Zzsky.Cn 技術(shù)區(qū) 網(wǎng)頁(yè)技術(shù) JavaScript HTML/XHTML/CSS Ajax 網(wǎng)頁(yè)制作工具 設(shè)計(jì)/圖形 Flash/多媒體 VML/Web3D Web編程 Java .Net ASP/VBScript PHP Perl/Python Web綜合/開源 數(shù)據(jù)庫(kù) Access/SQLServer MySQL/PostgreSQL Oracle/DB2/Sybase 服務(wù)器 Windows/IIS Unix/Linux/Apache 應(yīng)用服務(wù)器 二級(jí)目錄 三級(jí)目錄 四級(jí)目錄 五級(jí)目錄 . 第n級(jí)目錄 葉結(jié)點(diǎn)1 葉結(jié)點(diǎn)2 葉結(jié)點(diǎn)3 二級(jí)目錄 三級(jí)目錄 四級(jí)目錄 五級(jí)目錄 . 第n級(jí)目錄 葉結(jié)點(diǎn)1 葉結(jié)點(diǎn)2 葉結(jié)點(diǎn)3 !- function Ob(o) var o=document.getElementById(o)?document.getElementById(o):o; return o; function Hd(o) Ob(o).style.display=none; function Sw(o) Ob(o).style.display=; function ExCls(o,a,b,n) var o=Ob(o); for(i=0;in;i+) o=o.parentNode; o.className=o.className=a?b:a; function CNLTreeMenu(id,TagName0) this.id=id; this.TagName0=TagName0=?li:TagName0; this.AllNodes = Ob(this.id).getElementsByTagName(TagName0); this.InitCss = function (ClassName0,ClassName1,ClassName2,ImgUrl) this.ClassName0=ClassName0; this.ClassName1=ClassName1; this.ClassName2=ClassName2; this.ImgUrl=ImgUrl | /effect/images/treemenu/s.gif; this.ImgBlankA =; this.ImgBlankB =; for (i=0;ithis.AllNodes.length;i+ ) this.AllNodesi.className=?this.AllNodesi.className=ClassName1