Jquery 隔行变色及鼠标经过变色的代码一例
发布时间：2015-10-13 编辑：jiaochengji.com
为大家介绍一个Jquery实现的隔行变色及鼠标经过变色的代码，有需要的朋友，可以参考下。
代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <title> 隔行换色</title> <mce:script type="text/javascript" src="common/jquery-1.2.6.min.js" mce_src="common/jquery-1.2.6.min.js"></mce:script> <link type="text/css" rel="stylesheet" href="common/common.css" mce_href="common/common.css" /> <mce:style><!-- /* 隔行换色 */ .demoOver{background:#ccc;} .demoBg{background:#f1f1f1;} --></mce:style><style mce_bogus="1">/* 隔行换色 */ .demoOver{background:#ccc;} .demoBg{background:#f1f1f1;}</style> </head> <body> <mce:script type="text/javascript"><!-- // 隔行换色 $(function(){ $(".demo ul li").mouseover(function(){ $(this).addClass("demoOver"); }).mouseout(function(){ $(this).removeClass("demoOver"); }) $(".demo ul li:even").addClass("demoBg"); }) // --></mce:script> <!-- 隔行换色 --> <div class="demo"> <ul> <li>脚本学堂_www.jbxue.com，欢迎大家的光临。</li> <li>脚本学堂_www.jbxue.com，欢迎大家的光临。</li> <li>脚本学堂_www.jbxue.com，欢迎大家的光临。</li> <li>脚本学堂_www.jbxue.com，欢迎大家的光临。</li> <li>脚本学堂_www.jbxue.com，欢迎大家的光临。</li> </ul> </div> </body> </html>您可能感兴趣的文章：
jQuery 表格隔行换色 鼠标高亮行变色的实现代码
javascript实现隔行变色函数代码一例
Jquery 隔行变色及鼠标经过变色的代码一例
js 隔行变色与鼠标悬停自动变色的实现代码
js 隔行变色 鼠标经过变色的代码
JS控制表格隔行变色的实现代码
js 隔行变色的最简单代码
Js实现表格隔行变色，鼠标经过时高亮显示的代码
JQuery实现表格隔行换色(隔行变色)效果代码一例
Js表格隔行换色(隔行变色)代码一例
[关闭]