淺談jQuery hover(over, out)事件函數(shù)
hover(over, out)事件函數(shù)
當(dāng)鼠標(biāo)移動一個(gè)匹配的元素上面,會觸發(fā)指定的第一個(gè)函數(shù)
當(dāng)鼠標(biāo)移出這個(gè)元素時(shí),會觸發(fā)指定的第二個(gè)函數(shù)
over(function):鼠標(biāo)移到元素上觸發(fā)的函數(shù)
out(function):鼠標(biāo)移出元素觸發(fā)的函數(shù)
<nav class="main-nav"> <a href="/"><span>首頁</span></a> <a href="/about"><span>關(guān)于考試</span></a> <a href="/exam"><span>報(bào)考指南</span></a> <a href="/news"><span>考試情報(bào)</span></a> <a href="/career"><span>考試與就業(yè)</span></a> <a class="omega" href="/sitemap"><span>網(wǎng)站地圖</span></a> </nav> <script> $(function(){
//鼠標(biāo)移到與移出,移到元素時(shí),添加當(dāng)前元素樣式,并且去掉當(dāng)前頁面的樣式。鼠標(biāo)移出時(shí),去掉當(dāng)前元素的樣式,并且添加當(dāng)前頁面的樣式 $('.main-nav').find('a').hover( function(){$(this).addClass('cur');$('.main-nav').find('a[href="<?php echo "/".$path[1];?>"]').removeClass('cur');}, function(){$(this).removeClass('cur');$('.main-nav').find('a[href="<?php echo "/".$path[1];?>"]').addClass('cur');} ); $('.main-nav').find('a[href="<?php echo "/".$path[1];?>"]').addClass('cur'); //加載頁面時(shí)就添加樣式 }); </script>
獲取<a href="/"></a>這個(gè)元素
$(".main-nav").find('a[href="/"]');
以上這篇淺談jQuery hover(over, out)事件函數(shù)就是小編分享給大家的全部內(nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
- 使用jquery給新生的th綁定hover事件的實(shí)例
- jQuery hover事件簡單實(shí)現(xiàn)同時(shí)綁定2個(gè)方法
- jquery中取消和綁定hover事件的實(shí)現(xiàn)代碼
- jQuery實(shí)現(xiàn)hover合成事件的方法
- JQuery中使用on方法綁定hover事件實(shí)例
- jQuery中多個(gè)元素的Hover事件解決方案
- jQuery 鼠標(biāo)經(jīng)過(hover)事件的延時(shí)處理示例
- jQuery的live()方法對hover事件的處理示例
- 使用jquery hover事件實(shí)現(xiàn)表格的隔行換色功能示例
- 完美解決jQuery的hover事件在IE中不停閃動的問題
相關(guān)文章
jQuery控制元素顯示、隱藏、切換、滑動的方法總結(jié)
這篇文章主要介紹了jQuery控制元素顯示、隱藏、切換、滑動的方法總結(jié),本文講解了hide()、show() 、slideDown、slideUp、 slideToggle、fadeIn()、fadeOut()、fadeTo()等方法使用實(shí)例,需要的朋友可以參考下2015-04-04jQuery實(shí)現(xiàn)簡單的點(diǎn)贊效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)簡單的點(diǎn)贊效果的相關(guān)資料,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-01-01jQuery實(shí)現(xiàn)tag便簽去重效果的方法
這篇文章主要介紹了jQuery實(shí)現(xiàn)tag便簽去重效果的方法,較為詳細(xì)的分析了html頁面及js代碼的實(shí)現(xiàn)技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-01-01jQuery實(shí)現(xiàn)標(biāo)題有打字效果的焦點(diǎn)圖代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)標(biāo)題有打字效果的焦點(diǎn)圖代碼,可實(shí)現(xiàn)幻燈片切換顯示時(shí)標(biāo)題同步逐個(gè)打印顯示的效果,涉及jQuery操作json格式數(shù)據(jù)及時(shí)間函數(shù)的相關(guān)技巧,需要的朋友可以參考下2015-11-11jquery mobile changepage的三種傳參方法介紹
本來覺得changePage 那么多option,傳幾個(gè)參數(shù)應(yīng)該沒問題結(jié)果翻遍國內(nèi)外網(wǎng)站,基本方法只有三種,下面與大家分享下,感興趣的朋友可以參考下2013-09-09Lazy Load 延遲加載圖片的jQuery插件中文使用文檔
Lazy Load 是一個(gè)用 JavaScript 編寫的 jQuery 插件. 它可以延遲加載長頁面中的圖片. 在瀏覽器可視區(qū)域外的圖片不會被載入, 直到用戶將頁面滾動到它們所在的位置. 這與圖片預(yù)加載的處理方式正好是相反的2012-10-10jQuery Pagination分頁插件_動力節(jié)點(diǎn)Java學(xué)院整理
此jQuery插件為Ajax分頁插件,一次性加載,故分頁切換時(shí)無刷新與延遲,如果數(shù)據(jù)量較大不建議用此方法,因?yàn)榧虞d會比較慢。下面通過本文給大家分享jQuery Pagination分頁插件的使用方法及參數(shù)介紹,感興趣的朋友一起看看吧2017-07-07使用JQuery和s3captche實(shí)現(xiàn)一個(gè)水果名字的驗(yàn)證
大家登陸各種網(wǎng)站見到的驗(yàn)證碼應(yīng)該無外乎數(shù)字,字母和漢字。有沒有見識過使用水果名字和水果圖片來驗(yàn)證客戶端不是個(gè)機(jī)器人嗎?2009-08-08