JS + CSS 制作的一个精美太普菜单

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JS + CSS 制作的一个精美太普菜单 作者RED Cherry QQ122486006 欢迎技术交流</title>
</head>
<style type="text/css">
* {
margin:0px;
padding:0px;
}
body {
padding-top:200px;
font-size:12px;
}
div#news0 {
width:300px;
background:#C4adC2;
height:200px;
padding-top:20px;
color:#FFF;
text-align:center;
}
div#news1 {
width:300px;
background:#A85BAB;
height:200px;
padding-top:20px;
color:#FFF;
display:none;
text-align:center;
}
div#news2 {
padding-top:20px;
color:#FFF;
width:300px;
background:#dabA9A;
height:200px;
display:none;
text-align:center;
}
div#Titles {
width:300px;
background:#CCC;
height:35px;
text-align:center;
}
div#Titles a {
width:85px;
height:25px;
margin-left:10px;
margin-top:5px;
float:left;
background:#999;
line-height:25px;
color:#FFF;
text-align:center;
text-decoration:none;
}
div#Titles a:hover {
background:#666;
color:#ffd;
}
</style>
<script>
function show(obj){
var divId = document.getElementsByTagName("div");
for(var i=0;i<divId.length;i++){
if(divId[i].id==obj.id){
divId[i].style.display="block";
}
else{
if(divId[i].id=="Titles"){
divId[i].style.display="block";
}
else{
divId[i].style.display="none";
}
}
}
}
function changercolor(obj){
var ArrayName = document.getElementsByTagName("a");
var len = ArrayName.length;
for(var i=0;i<len;i++)
{
if(ArrayName[i].id==obj.id){
ArrayName[i].style.background="#3cf";
ArrayName[i].style.fontSize=14;
}
else{
new function (){
ArrayName[i].style.fontSize=12;
ArrayName[i].style.background="#999";
}
}
}
}
</script>
<body>
<center>
  <div id="Titles"> <a id="n1" href="#" onclick="show(news0),changercolor(this)">走近科学</a> <a id="n2" href="#"  onclick="show(news1),changercolor(this)">百科探密</a> <a  id="n3" href="#"  onclick="show(news2),changercolor(this)">探索发现</a> </div>
  <div id="news0">走近科学</div>
  <div id="news1">百科探密</div>
  <div id="news2">探索发现</div>
</center>
</body>
</html>