下拉菜单

<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>
   

posted @ 2017-09-12 11:54  小牧临风  阅读(82)  评论(0编辑  收藏  举报