[转]无刷新完美可切换标签1.0 , 我做了一点修改

<style>
a { display:block;width:100%; text-decoration:none;blr:expression(this.onFocus=this.blur())}
:focus { -moz-outline-style: none; } /* for Firefox */
ul { 
    margin:0px;padding:0px; height:20px;
    margin-bottom:-1px;
    position:relative;
    z-index:2;
    BORDER:0px solid black;
    width:600px;
}
li {
    background-color:#CCC;
    height:20px;
    text-align:center;float:left;display:block;
    margin-right:5px; border:1px solid blue; width:100px;
    border-radius-topleft: 0.5em;
    border-radius-topright: 0.5em;
    -moz-border-radius-topleft: 0.5em;
    -moz-border-radius-topright: 0.5em;
}
.c{border-bottom:1px solid #FFFFFF; background-color:#FFF}
.hidden {
    display: none;    
}
.display{
    display: block;
}
.subDiv{
    position:relative;
    z-index:1;
    BORDER:0px 1px 1px 1px;
    border-color: blue;
    border-style: solid;
    margin:0px;padding:10px; width:670px;
    height: 130px;
}
.clean{border: 0px; BORDER-bottom:1px solid blue; BACKGROUND: #FFF; width: 20px;}
</style>
<script language="javascript">
var now = 1;
function $(e){
 return document.getElementById(e);
}
function s(a){
if(a!=now) {
 $('l'+a).className='c'
 $('l'+now).className='none'
 $('bk'+now).className = 'hidden subDiv'
 $('bk'+a).className = 'display subDiv'
 now=a
}
 return false
}
</script>
<ul>
<li id="l0" class="clean"> </li>
<li id="l1" class="c"><a onmouseover="s(1);return false" href="/">aaa</a></li>
<li id="l2"><a onmouseover="s(2);return false" href="/">222</a></li>
<li id="l3"><a onmouseover="s(3);return false" href="/">333</a></li>
<li id="l4"><a onmouseover="s(4);return false" href="/">444</a></li>
</ul>
<div id="bk1" class="display subDiv" >11111111</div>
<div id="bk2" class="hidden subDiv" >22222</div>
<div id="bk3" class="hidden subDiv" >33333</div>
<div id="bk4" class="hidden subDiv" >44444</div>