Tab/Disappear
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<script type="text/javascript" src="http://luxury.bjhoutai.com/js/jquery-1.8.2.min.js"></script>
</head>
<style>
*{margin:0px; padding:0px;border:0px;}
li{list-style:none; float:left; margin:0px 5px;}
body{padding:20px;}
.mrt{ PADDING:20PX; BORDER:10pX SOLID #666}
</style>
<body>
<ul style='height:30px;'>
<li style="width:300px; background:#333; color:white; font-weight:bold; text-align:center; height:30px; line-height:30px;">啊时代发生地方</li>
<li style="width:300px; background:#333; color:white; font-weight:bold; text-align:center; height:30px; line-height:30px;">啊时代发生地方</li>
<li style="width:300px; background:#333; color:white; font-weight:bold; text-align:center; height:30px; line-height:30px;">啊时代发生地方</li>
</ul>
<div onMouseOver="showList('mrtksbox',1);" onMouseOut="showList('mrtksbox',0);" id="mrtksbox" class="mrt" style="display:none">11111<BR>AASDF<BR>AASDASDASDASDF<BR></div>
<div class="mrt" style="display:none">222222222222F<BR>AASDF<BR>AASDASDASDASDF<BR></div>
<div class="mrt" style="display:none">33333333<BR>AASDF<BR>AASDASDASDASDF<BR></div>
<script>
$('ul li').each(function(i) {
$(this).mouseover(function(){
$('.mrt').css('display','none');
$('.mrt:eq('+i+')').css('display','block');
$('.mrt:eq('+i+')').mouseover(function(){
$('.mrt:eq('+i+')').css('display','block');
});
});
});
$('ul li').mouseout(function(){
$('.mrt').css('display','none');
});
$('.mrt').mouseout(function(){
$('.mrt').css('display','none');
});
/* 标签内要添加 onMouseOver="showList('mrtksbox',1);" onMouseOut="showList('mrtksbox',0);"
function showList(e, t) {
t == 1 ?
(document.getElementById(e).style.display = "block", document.getElementById("mrt02").style.background = "url(images/mrtsyfx2.jpg) right no-repeat")
:
(document.getElementById(e).style.display = "none", document.getElementById("mrt02").style.background = "url(images/mrtsyfx.jpg) right no-repeat")
}
*/
</script>
</body>
</html>
