jquery導(dǎo)航制件jquery鼠標(biāo)經(jīng)過變色效果示例
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<title>鼠標(biāo)移到導(dǎo)航上面 當(dāng)前的LI變色 處于當(dāng)前的位置</title>
<style type="text/css">
ul,li{list-style:none;}
#nav li{display:inline-block;margin:0 5px;background:#ccc;padding:0 10px; line-height:24px;font-size:12px;float:left;}
#nav li.h_nav_over{background:red;color:#fff;}
#nav li.h_nav_over a{color:#fff;}
a{text-decoration:none;}
</style>
<script type="text/javascript" src="/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(function(){
$("#nav>ul>li").mouseover(function(){
$("#nav>ul>li").each(function(i){
$(this).removeClass("h_nav_over");
});
$(this).addClass("h_nav_over");
}).mouseout(function(){
$(this).addClass("h_nav_over");
});
});
</script>
</head>
<body>
<div id="nav">
<ul>
<li><a href="http://www.dhdzp.com" >首頁</a></li><li><a href="http://www.dhdzp.com/a/" >品牌商機</a></li>
<li><a href="http://www.dhdzp.com/" >精品商機</a></li><li><a href="http://www.dhdzp.com/" >最新商機</a></li>
<li><a href="http://www.dhdzp.com/" >投資考察會</a></li><li><a href="http://www.dhdzp.com/" >在線交流區(qū)</a></li>
</ul>
</div>
</body>
</html>
相關(guān)文章
jQuery實現(xiàn)文本顯示一段時間后隱藏的方法分析
這篇文章主要介紹了jQuery實現(xiàn)文本顯示一段時間后隱藏的方法,結(jié)合實例形式分析了jQuery事件響應(yīng)及頁面元素屬性動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2019-06-06
jQuery文本框(input textare)事件綁定方法教程
jquery的事件綁定已經(jīng)用on替換了原來的bind,接下來為大家分享下bind的使用方法及input textare事件2013-04-04
jQuery-ui引入后Vs2008的無智能提示問題解決方法
引入jQuery-vsdoc文件后,jQuery庫就能智能提示了,解決方法很簡單在jQuery-ui的目錄下再加入一個空的JS文件,命名jquery-ui-vsdoc.js2014-02-02
EasyUI中datagrid在ie下reload失敗解決方案
這篇文章主要介紹了EasyUI中datagrid在ie下reload失敗解決方案,結(jié)合網(wǎng)上搜集來的幾種方案,最終解決了這個問題,分享給大家,希望對大家能夠有所幫助。2015-03-03
使用BootStrap和Metroui設(shè)計的metro風(fēng)格微網(wǎng)站或手機app界面
今天使用bootstrap和metroui設(shè)計了一個metro風(fēng)格的移動app或者微信微網(wǎng)站的界面,非常不錯具有參考借鑒價值,感興趣的朋友可以參考下2016-10-10
基于JQuery實現(xiàn)相同內(nèi)容合并單元格的代碼
我們就中和下利用JQuery來和他一個table里面相同內(nèi)容的單元格,這里代碼跟大家分享下,希望對大家有用2011-01-01

