下拉菜单
<html>
<head>
<title>一款DIV+CSS的折叠下拉菜单丨芯晴网页特效丨CsrCode.Cn</title>
<style type="text/css">
.menutitle{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.submenu{
margin-bottom: 0.5em;
}
</style>
</head>
<body>
<script type="text/javascript">
/***********************************************
* Switch Menu script- by Martial B of http://getElementById.com/
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //DynamicDrive.com change
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
</script>
<!-- Keep all menus within masterdiv-->
<div id="masterdiv">
<div class="menutitle" onclick="SwitchMenu('sub1')">CsrCode.Cn</div>
<span class="submenu" id="sub1">
<a href="http://www.CsrCode.cn/html/txdm/">网页特效</a> -
<a href="http://www.33567.cn/">珊珊影视</a> -
<a href="http://www.7caidy.com/">七彩影视</a> -
<a href="http://Links.CsrCode.Cn/">链接平台</a> -
<a href="http://Changshi.CsrCode.Cn/">生活常识</a> -
<a href="http://idc.csrcode.cn/">月付主机</a>
</span>
<div class="menutitle" onclick="SwitchMenu('sub2')">网页特效①</div>
<span class="submenu" id="sub2">
<a href="http://www.CsrCode.cn/html/txdm/cddh/" title="">菜单导航特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/tcys/" title="">图层样式特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/ljwb/" title="">链接文本特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/txtx/" title="">图形图像特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/sbtx/" title="">鼠标特效代码</a> -
<a href="http://www.CsrCode.cn/html/txdm/ymck/" title="">页面窗口特效</a>
</span>
<div class="menutitle" onclick="SwitchMenu('sub3')">网页特效②</div>
<span class="submenu" id="sub3">
<a href="http://www.CsrCode.cn/html/txdm/wybj/" title="">网页背景特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/rqsj/" title="">日期时间特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/ymss/" title="">页面搜索特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/bgtx/" title="">表格表单特效</a> -
<a href="http://www.CsrCode.cn/html/txdm/qtdm/" title="">其他网页特效</a>
</span>
<div class="menutitle" onclick="SwitchMenu('sub4')">源码下载站</div>
<span class="submenu" id="sub4">
<a href="#" title="">淘客源码下载</a> -
<a href="#" title="">CMS系统源码</a> -
<a href="#" title="">seo工具软件</a>
</span>
<img src="/images/skinslogo.gif" onclick="SwitchMenu('sub6')" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/>
<span class="submenu" id="sub6">
<a href="http://www.CsrCode.cn/html/txdm/">网页特效</a> -
<a href="http://www.33567.cn/">珊珊影视</a> -
<a href="http://www.7caidy.com/">七彩影视</a> -
<a href="http://Links.CsrCode.Cn/">链接平台</a> -
<a href="http://Changshi.CsrCode.Cn/">生活常识</a> -
<a href="http://idc.csrcode.cn/">月付主机</a>
</span>
</div>
</body>
</html>
<br><hr>
<p align="center">本特效由 <a href="http://www.CsrCode.cn" target="_blank">芯晴网页特效</a>丨CsrCode.Cn 收集于互联网,只为兴趣与学习交流,不作商业用途。</p>