Ah, guess i misunderstood.
A way to handle that could be to check what the current page is and
highlight the menu item of the link who has a href to that page.
And add an extra check to the mouseout function to only remove the _on
suffix if its not the current page.
Would something like this work?
$('.nav a img').hover(
function(){
if($(this).attr("src").indexOf("_on") == -1) {
var newSrc =
$(this).attr("src").replace(".png","_on.png");
$(this).attr("src",newSrc);
}
},
function(){
var activePage = window.location.pathname.substr(1);
if($(this).parent().attr("href") != activePage) {
if($(this).attr("src").indexOf("_on.png") !=
-1) {
var oldSrc =
$(this).attr("src").replace("_on.png",".png");
$(this).attr("src",oldSrc);
}
}
}
);
var activePage = window.location.pathname.substr(1);
$("a[href="+activePage+"] img").trigger("mouseover");
On Apr 11, 3:04 pm, Takaya213 <nic...@njwebdesign.co.za> wrote:
> Nope, not quite what I was looking for.
>
> I want the one that is selected (page that you are on e.g. Home) to stay
> selected when one hovers over it, and the others to show a hover and then
> change back to the unselected state, but the one that is selected (page you
> are on) to stay selected.
>
>
>
> victorg-2 wrote:
>
> > Maybe you should switch it to make use of the mouseover event only,
> > and on mouseover change all menu items to off status and set the
> > curret one to on?
>
> > $(".nav a img").mouseover(function() {
> > // clear all menu items with _on img
> > $(".nav a img").each(function(){
> > var src = $(this).attr("src");
> > if(src.indexOf("_on") != -1)
> > {
> > $(this).attr("src", src.replace("_on.png",
> > ".png"));
> > }
> > });
> > // set current menu item to "on"
> > var src = $(this).attr("src");
> > $(this).attr("src", src.replace(".png", "_on.png"));
> > });
>
> --
> View this message in
> context:http://www.nabble.com/Menu-Hover-and-Selected-tp22999583s27240p230009...
> Sent from the jQuery General Discussion mailing list archive at Nabble.com.
