<html>
<head>
<title>jQuery实例</title>
<script type="text/javascript" src="jquery-1.8.2.js"></script>
<script type="text/javascript">
//jQuery的快捷入口
$(function(){
var cc=null;
$("li").mouseover(function(){
//鼠标移入事件处理
cc=$(this).css("background-color");//先获取原背景颜色
$(this).css("background-color","#ffcc00");
}).mouseout(function(){
//鼠标移出事件
$(this).css("background-color",cc);//设回原来颜色
}).css("background-color","#fff");
//给索引号为偶数的行添加斑马线颜色
$("li:even").css("background-color","#ccc");
});
</script>
</head>
<body>
<h2>jQuery实例--实现斑马线效果</h2>
<ul style="width:400px;border:1px solid #ccc">
<li>aaaaaaaaa</li>
<li>bbbbbbbbbb</li>
<li>ccccccc</li>
<li>dddddddddd</li>
<li>dddddddddd</li>
<li>eeeeeeeeee</li>
<li>wwwwwwwww</li>
<li>aaaaaaaaa</li>
<li>bbbbbbbbbb</li>
<li>ccccccc</li>
<li>dddddddddd</li>
<li>dddddddddd</li>
<li>eeeeeeeeee</li>
<li>wwwwwwwww</li>
</ul>
</body>
</html>
7935
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
