【jquery】hover方法
2020-12-13 02:48
标签:style blog class code java ext 方法名称:hover(over, out) 概述:当鼠标移动到一个匹配的元素上面时,会触发指定的第一个函数。当鼠标移出这个元素时,会触发指定的第二个函数。 参数: 1) overFunction 鼠标移到元素上要触发的函数 2) outFunction 鼠标移出元素要触发的函数 例子: 效果图: 【jquery】hover方法,搜素材,soscw.com 【jquery】hover方法 标签:style blog class code java ext 原文地址:http://www.cnblogs.com/ningvsban/p/3720718.html 1 DOCTYPE html>
2 html>
3 head>
4 meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5 title>鼠标滑过效果title>
6 script src="http://files.cnblogs.com/ningvsban/jquery1.8.3.min.js" type="text/javascript">script>
7 script type="text/javascript">
8 $(document).ready(function() {
9 //$("#orderedlist tbody tr").css("text-align","center");
10 $("#orderedlist tbody tr").css({"text-align":"center"});
11 $("#orderedlist tbody tr").hover(function() {
12 $(this).addClass("blue");
13 }, function() {
14 $(this).removeClass("blue");
15 });
16 });
17 script>
18 style>
19 .blue {
20 background:#bcd4ec;
21 cursor:pointer;
22 }
23 style>
24 head>
25 body>
26 table id="orderedlist" width="50%" border="0" cellspacing="0" cellpadding="0">
27 thead>
28 tr>
29 th>姓名th>
30 th>年龄th>
31 th>QQth>
32 th>Emailth>
33 tr>
34 thead>
35 tbody>
36 tr>
37 td>AAAAtd>
38 td>20td>
39 td>1111td>
40 td>aaaa@gmail.comtd>
41 tr>
42 tr>
43 td>BBBBtd>
44 td>21td>
45 td>2222td>
46 td>bbbb@gmail.comtd>
47 tr>
48 tr>
49 td>CCCCtd>
50 td>22td>
51 td>333td>
52 td>cccc@gmail.comtd>
53 tr>
54 tbody>
55 table>
56 body>
57 html>
58 html>