<p>TEST</p>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">// <![CDATA[
$(function(){
$(".content div").hide();
$("li").hover(function() {
$(this).toggleClass('hover');
$(".content").find("div").eq($(this).index()).show();
}, function() {
$(this).toggleClass('hover');
$(".content").find("div").eq($(this).index()).hide();
});
$(".content div").hover(function() {
$(this).show();
}, function() {
$(this).hide();
});
})
// ]]></script>
<style><!--
*{margin:0;padding:0;}
body{padding:20px;}
ul{float:left;}
li{margin-bottom:20px;padding:20px;width:150px;height:10px;border:1px solid #ccc;}
.content{float:left;}
.content div{padding:20px;width:800px;height:200px;border:1px solid #ccc;}
.hover{background:#ff6699;}
--></style>
<ul>
<li><span>我是li 1</span></li>
<li><span>我是li 2</span></li>
<li><span>我是li 3</span></li>
</ul>
<div class="content">
<div>我是我是li 1的div</div>
<div>我是我是li 2的div</div>
<div>我是我是li 3的div</div>
</div>
