手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >Jquery的hover方法让鼠标经过li时背景变色
Jquery的hover方法让鼠标经过li时背景变色
摘要:复制代码代码如下:StripingTable$(document).ready(function(){$("#orderedlisttbod...

复制代码 代码如下:

<!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=gb2312" />

<title>StripingTable</title>

<script src="jquery-1.1.3.pack.js" type="text/javascript"></script>

<>

<script type="text/javascript">

$(document).ready(function() {

$("#orderedlist tbody tr").hover(function() {

// $("#orderedlist li:last").hover(function() {

$(this).addClass("blue");

}, function() {

$(this).removeClass("blue");

});

});

</script>

<style>

.blue {

background:#bcd4ec;

}

</style>

</head>

<body>

<table id="orderedlist" width="50%" border="0" cellspacing="0" cellpadding="0">

<>

<thead>

<tr>

<th>姓名</th>

<th>年龄</th>

<th>QQ</th>

<th>Email</th>

</tr>

</thead>

<tbody>

<tr>

<td>邓国梁</td>

<td>23</td>

<td>31540205</td>

<td>gl.deng@gmail.com</td>

</tr>

<tr>

<td>邓国梁</td>

<td>23</td>

<td>31540205</td>

<td>gl.deng@gmail.com</td>

</tr>

<tr>

<td>邓国梁</td>

<td>23</td>

<td>31540205</td>

<td>gl.deng@gmail.com</td>

</tr>

<tr>

<td>邓国梁</td>

<td>23</td>

<td>31540205</td>

<td>gl.deng@gmail.com</td>

</tr>

<tr>

<td>邓国梁</td>

<td>23</td>

<td>31540205</td>

<td>gl.deng@gmail.com</td>

</tr>

<tr>

<td>邓国梁</td>

<td>23</td>

<td>31540205</td>

<td>gl.deng@gmail.com</td>

</tr>

</tbody>

</table>

</body>

</html>

1

【Jquery的hover方法让鼠标经过li时背景变色】相关文章:

JQuery中节点遍历方法实例

JavaScript中的anchor()方法使用详解

jquery实现图片左右切换的方法

JavaScript中的acos()方法使用详解

JQuery中clone方法复制节点

JavaScript中的unshift()方法的使用

JS控制表格隔行变色

Javascript中的getUTCHours()方法使用详解

Jquery使用css方法改变样式实例

Jquery实现动态切换图片的方法

精品推荐
分类导航