Javascript Guru's please help :)

randombar

Hi Lads,

Having an issue with one of the sites I'm doing a bit of work for:

Ballygarvan Gaa

They want me to change the text to Irish when you do a hover over. Which is doable, thing is the hover over is already works a show/hide of sub menus.

Soooo I was wondering if someone knew how to tweak the JS that's already working to add a change text on a hover over??

Here's the JS So far

sfHover = function() {
	var sfEls = document.getElementById("nav").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

kevteljeur

GaryCocs wrote: »

Hi Lads,

Having an issue with one of the sites I'm doing a bit of work for:

Ballygarvan Gaa

They want me to change the text to Irish when you do a hover over. Which is doable, thing is the hover over is already works a show/hide of sub menus.

Soooo I was wondering if someone knew how to tweak the JS that's already working to add a change text on a hover over??

Here's the JS So far

sfHover = function() {
    var sfEls = document.getElementById("nav").getElementsByTagName("LI");
    for (var i=0; i<sfEls.length; i++) {
        sfEls[i].onmouseover=function() {
            this.className+=" sfhover";
        }
        sfEls[i].onmouseout=function() {
            this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
        }
    }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

I used to use this code myself; it's for IE, to get hover functionality (but you probably knew that already). You might consider just replacing it with something similar using JQuery, and then you can more easily extend it to do what you want...

Eoin

From what I can tell your code appends an extra classname to the <li> tag that is being hovered over. So, the same code works for each tag which means that no parameter is being passed in. The quickest way is probably to hardcode something in the following section.

You'll need to find out what the current link is, and then swap it accordingly. You'll then need to do the opposite in the onmouseout function to revert the text.

I can't remember off the top of my head, but I think something like this might work.

sfEls[i].onmouseover=function() {
    this.className+=" sfhover";
    if (sfEls[i].innerHTML == "home")
    {
         //show hide the divs here
    }
}

randombar

Would be interested in finding out more of that jquery code all right.

I might go into hard coding the links in and adding id's to all of them if that helps??