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