zoukankan      html  css  js  c++  java
  • js菜单效果

    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <style>
    body{
    margin:20;
    padding:0;
    font-size:12px; color:#333;
    font-family:Arial, Helvetica, sans-serif;
    background:#FFF url(../images/bg.jpg) top center repeat-x;
    line-height:1.8;}

    a:link {color: #333; text-decoration:none;}
    a:visited {color: #333; text-decoration:none;}
    a:hover {color: #333; text-decoration:none;}
    a:active {color: #333; text-decoration:none;}
    .cRed,a.cRed:link,a.cRed:visited{ color:#DA0000; }
    .fB {font-weight: bold;}
    </style>
    <script language="javascript">
    var lastClick;
    function swap(id){
     var lc=document.getElementById(id);
     if(lc){
      if(lastClick){
       lastClick.style.display = 'none';
      }
      lastClick = lc;
      if(lc.style.display =='block'){
       lc.style.display = 'none';
      }else{
       lc.style.display = 'block';
      }
     }   
    }
    </script>
    </head>

    <body>
    <a href="javascript:swap('ABOUT');" class="fB cBlack">About us</a><br />
    <div style="display: none; padding-left: 20px;" id="ABOUT"><a href="aboutus.html" class="cRed">ABOUT US</a></div>

    <a href="javascript:swap('JOB');" class="fB cBlack">Join us</a><br />
    <div style="display: none; padding-left: 20px;" id="JOB"><a href="joinus.html" class="cRed">JOIN US</a></div>

    <a href="javascript:swap('CONTACT');" class="fB cBlack">Contact us</a><br />
    <div style="display: none; padding-left: 20px;" id="CONTACT"><a href="contactus.html" class="cRed">CONTACT US</a></div>
    </body>
    </html>

  • 相关阅读:
    python走起之第十七话
    python走起之第十五话
    python走起之第十四话
    python走起之第十三话
    python走起之第十二话
    python走起之第十一话
    python走起之第九话
    python走起之第九话
    python走起之第八话
    python走起之第六话
  • 原文地址:https://www.cnblogs.com/yiwd/p/1486692.html
Copyright © 2011-2022 走看看