淺談jQuery hover(over, out)事件函數(shù)
hover(over, out)事件函數(shù)
當鼠標移動一個匹配的元素上面,會觸發(fā)指定的第一個函數(shù)
當鼠標移出這個元素時,會觸發(fā)指定的第二個函數(shù)
over(function):鼠標移到元素上觸發(fā)的函數(shù)
out(function):鼠標移出元素觸發(fā)的函數(shù)
<nav class="main-nav">
<a href="/"><span>首頁</span></a>
<a href="/about"><span>關于考試</span></a>
<a href="/exam"><span>報考指南</span></a>
<a href="/news"><span>考試情報</span></a>
<a href="/career"><span>考試與就業(yè)</span></a>
<a class="omega" href="/sitemap"><span>網站地圖</span></a>
</nav>
<script>
$(function(){
//鼠標移到與移出,移到元素時,添加當前元素樣式,并且去掉當前頁面的樣式。鼠標移出時,去掉當前元素的樣式,并且添加當前頁面的樣式
$('.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'); //加載頁面時就添加樣式
});
</script>
獲取<a href="/"></a>這個元素
$(".main-nav").find('a[href="/"]');
以上這篇淺談jQuery hover(over, out)事件函數(shù)就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關文章
基于jquery實現(xiàn)的可編輯下拉框實現(xiàn)代碼
昨天看到QQ登錄的時候,可以選擇以前登錄過的賬戶,這個東西也可以在網站登錄的時候用到,所以我就想做一個這樣的插件;在網上查了很多,沒有找到合適自己的,所以決定自動制作一個2014-08-08
jQuery實現(xiàn)的超酷蘋果風格圖標滑出菜單效果代碼
這篇文章主要介紹了jQuery實現(xiàn)的超酷蘋果風格圖標滑出菜單效果代碼,涉及jQuery基于鼠標hover事件動態(tài)操作頁面元素屬性的相關技巧,非常美觀實用,需要的朋友可以參考下2015-09-09
jQuery插件slider實現(xiàn)拖動滑塊選取價格范圍
jquery滑塊(slider)允許用戶從一個有限的范圍內選擇一個數(shù)值。當沿著軌道移動滑塊控件時,將顯示一個表示當前值的提示框,用戶可通過設置它的屬性來自定義滑塊。2015-04-04
jQuery實現(xiàn)帶有上下控制按鈕的簡單多行滾屏效果代碼
這篇文章主要介紹了jQuery實現(xiàn)帶有上下控制按鈕的簡單多行滾屏效果代碼,涉及jquery鼠標事件控制頁面翻頁滾動效果的相關實現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09
jquery插件star-rating.js實現(xiàn)星級評分特效
Bootstrap Star Rating是一個簡單而強大的jQuery插件實現(xiàn)星級分數(shù)評級。支持像分數(shù)星填充和RTL輸入先進的功能。在利用純CSS-3造型使控制重點開發(fā)。該插件使用引導標記和造型默認情況下,但它可以覆蓋與其他任何CSS的標記。2015-04-04

