效果演示

点击浏览该文件

上面的大家还是别用了!用下面这个!

CSS

.tag_box {
 BORDER-RIGHT: #b0bec7 1px solid; MARGIN: 0px; FONT: 12px Arial, Helvetica, sans-serif; OVERFLOW: hidden; BORDER-LEFT: #b0bec7 1px solid; WIDTH: 400px; BORDER-BOTTOM: #b0bec7 1px solid; HEIGHT: 250px
}
.tag_box UL.menulist {
 MARGIN: 0px; OVERFLOW: hidden; WIDTH: 402px; HEIGHT: 20px
}
.tag_box UL.menulist LI {
 BACKGROUND: url(yahoo 标签.files/tag_bg1.gif) repeat-x; FLOAT: left; WIDTH: 200px; LINE-HEIGHT: 19px; LIST-STYLE-TYPE: none; POSITION: relative; HEIGHT: 19px; TEXT-ALIGN: center
}
.tag_box UL.menulist LI A {
 DISPLAY: block; BACKGROUND: url(yahoo 标签.files/tag_pipe.gif) no-repeat right 1px; WIDTH: 200px; COLOR: #18397c; BORDER-BOTTOM: #93a6b4 1px solid; TEXT-DECORATION: none
}
.tag_box UL.menulist LI A:hover {
 TEXT-DECORATION: underline
}
.tag_box UL.menulist LI A.curMenu {
 BORDER-RIGHT: #91a7b4 1px solid; BORDER-TOP: #91a7b4 1px solid; FONT-WEIGHT: bold; Z-INDEX: 100; BACKGROUND: url(yahoo 标签.files/tag_bg2.gif) repeat-x; LEFT: -1px; BORDER-LEFT: #91a7b4 1px solid; WIDTH: 201px; COLOR: #c63; BORDER-BOTTOM: medium none; POSITION: absolute; TOP: -1px; HEIGHT: 21px
}
.tag_box A.nonebg {
 BACKGROUND: none transparent scroll repeat 0% 0%
}
.tag_content {
 CLEAR: both; PADDING-RIGHT: 6px; PADDING-LEFT: 6px; PADDING-BOTTOM: 6px; PADDING-TOP: 6px; height:250;
}
.tag_content IMG.bigConImg {
 BORDER-RIGHT: #788a98 1px solid; BORDER-TOP: #788a98 1px solid; DISPLAY: block; FLOAT: left; BORDER-LEFT: #788a98 1px solid; BORDER-BOTTOM: #788a98 1px solid
}
.tag_content H5 {
 PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 2px; MARGIN: 3px 6px; WIDTH: 250px; PADDING-TOP: 2px; BACKGROUND-COLOR: #f7f7f7; TEXT-ALIGN: center
}
.tag_content A {
 COLOR: #16387c; TEXT-DECORATION: none
}
.tag_content A:hover {
 TEXT-DECORATION: underline
}
.tag_content P {
 PADDING-RIGHT: 6px; PADDING-LEFT: 6px; FLOAT: left; PADDING-BOTTOM: 2px; MARGIN: 0px; LINE-HEIGHT: 18px; PADDING-TOP: 2px
}
.tag_content UL {
 PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FLOAT: left; PADDING-BOTTOM: 0px; MARGIN: 0px 3px; PADDING-TOP: 0px
}
.tag_content LI {
 MARGIN-BOTTOM: 3px; MARGIN-LEFT: 20px
}

switchTag.js

var currentTag = 1;
function fivetag(obj,id){
 selectMenu(obj);
 for (var i =1,j; j=document.getElementById("tag_content_"+i); i++){
  j.style.display="none";
 }
 document.getElementById("tag_content_"+id).style.display="block";
 currentTag++;
 if (currentTag>5)
 currentTag=1;
}
function selectMenu(obj){
 var lia = document.getElementById("menulist").getElementsByTagName("li");
 var lialen = lia.length;
 for(i=0; i<lialen; i++){
  if(lia[i].getElementsByTagName("a")[0].className=="curMenu")
  lia[i].getElementsByTagName("a")[0].className = "";
 }
 obj.className = "curMenu";
}
function init(){
 var menulist = document.getElementById("menulist");
 setInterval('fivetag(menulist.getElementsByTagName("li")[currentTag-1].getElementsByTagName("a")[0],currentTag)',10000);
}

HTML

<div class="curMenu">
  <DIV class=tag_box id=tag_menu>
<UL class=menulist id=menulist>
  <LI><A class=curMenu onfocus=this.blur() onclick=fivetag(this,1)
  href="">梧州区</A> </LI>
  <LI><A onfocus=this.blur() onclick=fivetag(this,2)
  href="">贺州区</A>  </LI>
 </UL><!--
-->
<DIV class=tag_content id=tag_content_1>1</DIV>
<DIV class=tag_content id=tag_content_2>2</DIV>
</DIV></div>

不知道为什么?在火狐下不能正常,在IE就可以!请大家帮我找找问题吧!!呵呵