<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>京东首页右侧固定层</title>
<link href="css/nav.css" rel="stylesheet">
</head>
<body>
<nav id="nav">
<li><span></span><p>就东会员</p></li>
<li><span></span><p>购物车</p></li>
<li><span></span><p>我的关注</p></li>
<li><span></span><p>我的足迹</p></li>
<li><span></span><p>我的消息</p></li>
<li><span></span><p>咨询JIMI</p></li>
</nav>
<script src="js/jquery-1.12.4.js"></script>
<script type="text/javascript">
$(function () {
$("#nav li span").mouseover(function () {
$(this).css("background-color","#c81623");
var index =$("#nav li span").index(this);
$("#nav li:eq("+index+") span~p").show();
}).mouseout(function () {
$(this).css("background-color","#7a6e6e");
var index =$("#nav li span").index(this);
$("#nav li:eq("+index+") span~p").hide();
})
})
</script>
</body>
</html>