jQuery 抄袭笔记(11) : Hover()
13 Oct 2011</embed>
hover(over,out)一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。
当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。
over (Function) : 鼠标移到元素上要触发的函数
out (Function) : 鼠标移出元素要触发的函数
01 <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
02 <html xmlns=“http://www.w3.org/1999/xhtml”>
03 </span>
04 <meta http-equiv=“Content-Type” content=“text/html; charset=gb2312″ />
05</span>Hello Lazynight!<span style="color: #ff4400; font-weight: bold;"></title></span><br /> <span style="color: #696969;">06</span> <span style="color: #ff4400; font-weight: bold;"><script </span><span style="color: #ffff00;">src=</span><span style="color: #d13800;">“jquery-1.1.3.pack.js”</span> <span style="color: #ffff00;">type=</span><span style="color: #d13800;">“text/javascript”</span><span style="color: #ff4400; font-weight: bold;">></script></span><br /> <span style="color: #696969;">07</span> <span style="color: #ff4400; font-weight: bold;"><script </span><span style="color: #ffff00;">type=</span><span style="color: #d13800;">“text/javascript”</span><span style="color: #ff4400; font-weight: bold;">></span><br /> <span style="color: #696969;">08</span> <span style="color: #c0c0c0;">$</span>(<span style="color: #c0c0c0;">document</span><span style="color: #c0c0c0;">).</span><span style="color: #c0c0c0;">ready</span>(<span style="color: #ff4400; font-weight: bold;">function</span><span style="color: #c0c0c0;">(){</span><br /> <span style="color: #696969;">09</span> <span style="color: #c0c0c0;">$</span>(<span style="color: #d13800;">“#Lazy_list li”</span><span style="color: #c0c0c0;">).</span><span style="color: #c0c0c0;">hover</span>(<span style="color: #ff4400; font-weight: bold;">function</span><span style="color: #c0c0c0;">(){</span><br /> <span style="color: #f810b0;">10</span> <span style="color: #c0c0c0;">$</span>(<span style="color: #ff4400; font-weight: bold;">this</span><span style="color: #c0c0c0;">).</span><span style="color: #c0c0c0;">addClass</span>(<span style="color: #d13800;">“black”</span><span style="color: #c0c0c0;">);},</span><br /> <span style="color: #696969;">11</span> <span style="color: #ff4400; font-weight: bold;">function</span><span style="color: #c0c0c0;">(){</span><br /> <span style="color: #696969;">12</span> <span style="color: #c0c0c0;">$</span>(<span style="color: #ff4400; font-weight: bold;">this</span><span style="color: #c0c0c0;">).</span><span style="color: #c0c0c0;">removeClass</span>(<span style="color: #d13800;">“black”</span>);<br /> <span style="color: #696969;">13</span><br /> <span style="color: #696969;">14</span> <span style="color: #c0c0c0;">});</span><br /> <span style="color: #f810b0;">15</span> <span style="color: #c0c0c0;">});</span><br /> <span style="color: #696969;">16</span> <span style="color: #ff4400; font-weight: bold;"></script></span><br /> <span style="color: #696969;">17</span> <span style="color: #ff4400; font-weight: bold;"><style></span><br /> <span style="color: #696969;">18</span> <span style="color: #c0c0c0;">.black</span><span style="color: #c0c0c0;">{</span><span style="color: #ff4400; font-weight: bold;">background</span><span style="color: #c0c0c0;">:</span><span style="color: #c0c0c0;">#000</span>; <span style="color: #c0c0c0;">}</span><br /> <span style="color: #696969;">19</span> <span style="color: #ff4400; font-weight: bold;"></style></span><br /> <span style="color: #f810b0;">20</span> <span style="color: #ff4400; font-weight: bold;"></head></span><br /> <span style="color: #696969;">21</span> <span style="color: #ff4400; font-weight: bold;"><body></span><br /> <span style="color: #696969;">22</span> <span style="color: #ff4400; font-weight: bold;"><ul</span> <span style="color: #ffff00;">id=</span><span style="color: #d13800;">“Lazy_list”</span><span style="color: #ff4400; font-weight: bold;">></span><br /> <span style="color: #696969;">23</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">24</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #f810b0;">25</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">26</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">27</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">28</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">29</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #f810b0;">30</span> <span style="color: #ff4400; font-weight: bold;"></ul></span><br /> <span style="color: #696969;">31</span> <span style="color: #ff4400; font-weight: bold;"><ul</span> <span style="color: #ffff00;">id=</span><span style="color: #d13800;">“Lazy_list2″</span><span style="color: #ff4400; font-weight: bold;">></span><br /> <span style="color: #696969;">32</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">33</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">34</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #f810b0;">35</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">36</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">37</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">38</span> <span style="color: #ff4400; font-weight: bold;"><li></span>Lazynight | 夜阑<span style="color: #ff4400; font-weight: bold;"></li></span><br /> <span style="color: #696969;">39</span> <span style="color: #ff4400; font-weight: bold;"></ul></span><br /> <span style="color: #f810b0;">40</span><br /> <span style="color: #696969;">41</span> <span style="color: #ff4400; font-weight: bold;"></body></span><br /> <span style="color: #696969;">42</span> <span style="color: #ff4400; font-weight: bold;"></html></span>
</div>
<span style="color: #ff6600;"><a href="http://down.qiannao.com/space/file/flowerowl/-4e0a-4f20-5206-4eab/Lazy11_hover().rar/.page" target="_blank"><span style="color: #ff6600;">下载源码</span></a></span>
转载请注明：[于哲的博客][1] » [jQuery 抄袭笔记(11) : Hover()][2]
[1]: http://lazynight.me
[2]: http://lazynight.me/489.html
</li></span></li></span></li></span></li></span></li></span></li></span></li></span></li></span></li></span></li></span></li></span></li></span></li></span></li></span></body></span>
02 <html xmlns=“http://www.w3.org/1999/xhtml”>
03 </span>
04 <meta http-equiv=“Content-Type” content=“text/html; charset=gb2312″ />
05