详细内容

jQueyr基础教程 - hover用法，鼠标滑过改变背景颜色
更新时间：2009-8-20

简介：本章节演示了如何通过定义标签的hover方法来实现一些特殊效果，比如鼠标滑过标签时改变标签的样式

查看全部代码：查看

代码使用方法：

在网页<head>区添加以下代码


<!--引入jQuery-->
<script type="text/javascript" src="http://www.sharejs.com/software/jquery/jquery-1.3.2.min.js"></script>
<script src="jquery-1.1.3.pack.js" type="text/javascript"></script> 
<!--将jQuery引用进来-->
<script type="text/javascript">
/******************************************************
* 
jQueyr基础教程 - hover用法，鼠标滑过改变背景颜色
 Share JavaScript (http://www.ShareJS.com)
* 使用此脚本程序，请保留此声明
* 获取此脚本以及更多的JavaScript程序，请访问 http://www.ShareJS.com
******************************************************/

$(document).ready(function() {
$("#orderedlist tbody tr").hover(function() {
		$(this).addClass("blue");
	}, function() {
		$(this).removeClass("blue");
	});
});
</script>
<style>

.blue {
        background:#bcd4ec;  
}
 
</style>

在网页<body>区添加以下代码

Select All


<table id="orderedlist" width="50%" border="0" cellspacing="0" cellpadding="0">
<thread> 
  <tr>
    <th>姓名</th>
    <th>年龄</th>
    <th>QQ</th>
    <th>Email</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td>sharejs.com</td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>
   <tr>
    <td><a href="http://www.sharejs.com">sharejs.com</a></td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>
 <tr>
    <td>sharejs.com</td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>
 <tr>
    <td>sharejs.com</td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>
 <tr>
    <td>sharejs.com</td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>
 <tr>
    <td>sharejs.com</td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>
 <tr>
    <td>sharejs.com</td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>

 <tr>
    <td>sharejs.com</td>
    <td>23</td>
    <td>432432</td>
    <td>rewrew@sohu.com</td>
  </tr>
</tbody>
</table>

下载：从本地下载

上一篇：古典的书签试焦点图片切换效果下一篇：javascript计时器的工作原理解析

本类最新资源

本类最新

本类热门资源

本类热门