简洁型伸缩菜单(JavaScript)

代码简介：一个简洁型伸缩菜单，黑色超酷风格，简约实用，喜欢简洁的朋友可以试用一下哦。

代码内容：

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head >
< title > 简洁型伸缩菜单(JavaScript)_网页代码站(www.webdm.cn) </ title >
< style type ="text/css" >
* { margin : 0 ; padding : 0 ; }
body { font-family : Arial, Helvetica, sans-serif ; font-size : 12px ; color : #666 ; }
#box { width : 200px ; border : 1px solid #ccc ; } /* www.webdm.cn */
.title { font-size : 12px ; padding-left : 3px ; height : 20px ; border-bottom : 1px solid #fff ; background : #000 ; line-height : 20px ; color : #FFF ;

cursor : pointer ; }
.content { padding : 5px ; height : 150px ; }
</ style >
< script type ="text/javascript" >
function flexMenu(id)
{
var $id = document.getElementById(id);
var titleList = $id.getElementsByTagName( ' h2 ' );
var contentList = $id.getElementsByTagName( ' div ' );
titleList[titleList.length - 1 ].style.border = ' none ' ;
for ( var i = 0 ;i < titleList.length;i ++ )
{
titleList[i].onclick = function ()
{
for ( var a = 0 ;a < contentList.length;a ++ )
{
contentList[a].style.display = ' none ' ;
}
if ( this .nextSibling.nodeType == ' 3 ' )
{
this .nextSibling.nextSibling.style.display = '' ;
} else
{
this .nextSibling.style.display = '' ;
}
}
}
}
window.onload = function (){ flexMenu( ' box ' )}
</ script >
</ head >
< body >
< div id ="box" >
< h2 class ="title" > 网页代码站 </ h2 >
< div class ="content" >< a href ="http://www.webdm.cn" > 网站首页 </ a ></ div >
< h2 class ="title" > 网页特效 </ h2 >
< div class ="content" style ="display:none;" >< a href ="/" > 网页特效 </ a ></ div >
< h2 class ="title" > 源码下载 </ h2 >
< div class ="content" style ="display:none;" >< a href ="http://www.webdm.cn" > 源代码下载 </ a ></ div >
</ div >
</ body >
</ html >
< br >
< p >
< a href ="http://www.webdm.cn" > 网页代码站 </ a > - 最专业的代码下载网站 - 致力为中国站长提供有质量的代码！ </ p >

 

代码来自：http://www.webdm.cn/webcode/1cc839b9-1986-42f5-9b88-e41aa3b4f2a5.html

转载于:https://www.cnblogs.com/webdm/archive/2011/01/31/1948171.html