JavaScript導(dǎo)航腳本判斷當(dāng)前導(dǎo)航
廢話不多說(shuō),直接給大家貼代碼了。
<script> $(function () { //highlight current / active link 左側(cè)導(dǎo)航判斷當(dāng)前活動(dòng)導(dǎo)航 $('ul.main-menu li a').each(function () { var wo = window.location.href.substring(window.location.href.lastIndexOf('/') + 1, window.location.href.lastIndexOf('.')); if ($(this).attr('href') == (wo + ".html")) { $(this).parent().addClass('active'); $(this).parents().addClass('active'); $(this).parents('li').find("i:first").toggleClass("glyphicon-minus"); $(this).parents('ul').slideDown(); }else if (("dxs" == wo || "syd" == wo)&&($(this).attr('href')=="dbs.html")) { $(this).parent().addClass('active'); $(this).parents().addClass('active'); $(this).parents('li').find("i:first").toggleClass("glyphicon-minus"); $(this).parents('ul').slideDown(); } }); /*** begin 主頁(yè)左側(cè)菜單 */ $(".main-menu a").click(function () { //將當(dāng)前l(fā)i設(shè)置為活動(dòng)狀態(tài) $(this).find("i:first").toggleClass("glyphicon-minus"); }); $(".main-menu a").click(function () { //更換其他導(dǎo)航的加減號(hào)圖標(biāo) $(this).parent('li').siblings(".active").find("i:first").toggleClass("glyphicon-minus"); //alert($(this).index()); //去掉其他導(dǎo)航的點(diǎn)擊樣式并折疊 $(this).parent('li').siblings(".active").removeClass("active").children("ul").slideUp('fast'); $(this).next('ul').slideToggle('fast'); $(this).parent('li').addClass('active'); }); /************** end 主頁(yè)左側(cè)菜單 */ }) </script>
以上所述是小編給大家介紹的JavaScript導(dǎo)航腳本判斷當(dāng)前導(dǎo)航,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
- 一步步教大家編寫(xiě)酷炫的導(dǎo)航欄js+css實(shí)現(xiàn)
- JS實(shí)現(xiàn)選中當(dāng)前菜單后高亮顯示的導(dǎo)航條效果
- JS利用cookie記憶當(dāng)前位置的防刷新導(dǎo)航效果
- JS實(shí)現(xiàn)的簡(jiǎn)潔二級(jí)導(dǎo)航菜單雛形效果
- JS實(shí)現(xiàn)帶圓弧背景漸變效果的導(dǎo)航菜單代碼
- JS+CSS實(shí)現(xiàn)的日本門戶網(wǎng)站經(jīng)典選項(xiàng)卡導(dǎo)航效果
- js實(shí)現(xiàn)多選項(xiàng)切換導(dǎo)航菜單的方法
- CSS3+Js實(shí)現(xiàn)響應(yīng)式導(dǎo)航條
- js導(dǎo)航欄單擊事件背景變換示例代碼
相關(guān)文章
詳解JavaScript基于面向?qū)ο笾畡?chuàng)建對(duì)象(2)
這篇文章主要介紹了JavaScript基于面向?qū)ο笾畡?chuàng)建對(duì)象,詳細(xì)的分析面向?qū)ο蟮脑头绞揭约捌渌C合的方式,感興趣的小伙伴們可以參考一下2015-12-12js格式化貨幣數(shù)據(jù)實(shí)現(xiàn)代碼
貨幣數(shù)據(jù)想要一某種形式在頁(yè)面中顯示的話,首先是必須要格式化的,下面為大家介紹下具體的格式化代碼,感興趣的朋友可以參考下2013-09-09JS+CSS實(shí)現(xiàn)仿新浪微博搜索框的方法
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)仿新浪微博搜索框的方法,實(shí)例分析了javascript針對(duì)搜索框樣式的控制技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02Cpage.js給組件綁定事件的實(shí)現(xiàn)代碼
Cpage.js是一款輕量級(jí)的Mvvm框架,使用TypeScript(JavaScript的超集)開(kāi)發(fā)。下面通過(guò)本文給大家分享Cpage.js給組件綁定事件的實(shí)現(xiàn)代碼,需要的的朋友參考下吧2017-08-08JavaScript數(shù)組Array的一些常用方法總結(jié)
JavaScript的Array對(duì)象是用于構(gòu)造數(shù)組的全局對(duì)象,數(shù)組是類似于列表的高階對(duì)象,下面這篇文章主要給大家介紹了關(guān)于JavaScript數(shù)組Array的一些常用方法,需要的朋友可以參考下2021-11-11Javascript封裝id、class與元素選擇器方法示例
這篇文章主要給大家介紹了Javascript封裝id、class與元素選擇器的方法,文中給出了詳細(xì)的示例代碼,對(duì)大家的理解和學(xué)習(xí)具有一定的參考價(jià)值,需要的朋友們下面來(lái)一起看看吧。2017-03-03寫(xiě)出更好的JavaScript程序之undefined篇(中)
前一篇我介紹了幾種廣為使用的利用undefined這個(gè)概念值的辦法,這一篇我會(huì)介紹一些不太常見(jiàn)的辦法,其中還包括一個(gè)很巧妙的,我個(gè)人覺(jué)得很值得推廣的辦法。2009-11-11