jQuery navbar:悬停改变颜色

时间:2013-09-11 21:02:17

标签: jquery

我希望得到一些jQuery问题的帮助。我的网站上有一个导航栏,当前当您将鼠标悬停在其中一个导航栏链接上时,它会改变颜色。我想要它做的是当你点击一个链接并转到另一个页面时,我希望当前页面链接保持悬停的颜色,即使我再次悬停在它上面。所有其他链接应该是默认颜色,除非它们悬停在它们之上(然后它们应该改变颜色)。

以下是该页面的链接示例: http://chrisliaw.net63.net/portfolio/

主页链接应该已经是突出显示的颜色,但是当我将鼠标悬停在它上面然后将鼠标移开时它会变为默认的灰色。

有没有人有任何建议?

1 个答案:

答案 0 :(得分:0)

OO ......我用一些IF语句完成了..你可以用两种方式做到这一点: 1.使用Js查看您当前所在的页面..并为该链接提供一些课程 2.用户PHP进行此验证

以下是一些例子:

使用JS:

<div id="menu">
<a href="#" id='home-page'>Home</a>
 <a href="#" id='about-page'>About</a>
 <a href="#" id='some-page'>some page</a>
</div>

var sPath=window.location.pathname;
 var sPage = sPath.substring(sPath.lastIndexOf('/') + 1);
  if(sPage == "home.html")
   {
     $("#menu a").removeClass("Active-Link"); // reset all links
     $("#home").addClass("Active-Link"); // get current page link the class
   }

使用PHP

  <div id="menu">
    <a href="#" id='home-page' <?php if(basename($_SERVER['PHP_SELF']) == "home.html"){ echo " class='current-page' ";}?> >Home</a>
     <a href="#" id='about-page' <?php if(basename($_SERVER['PHP_SELF']) == "home.html"){ echo " class='current-page' ";}?>>About</a>
     <a href="#" id='some-page' <?php if(basename($_SERVER['PHP_SELF']) == "home.html"){ echo " class='current-page' ";}?>>some page</a>
    </div>

希望,这是你想要的代码.. :)试试吧:))