Event Handling - IE vs Mozilla (noob q)

OK, I'm sure this is familiar to many of you, but I'm just starting out with this. Anyway, I'm trying to get a little script to basically hide and show content. Works fine in Mozilla/Fx but not (surprise) in IE. Any help would be much appreciated.

Chris

var fnMouseOver1 = function()
{
document.getElementById("Tracks2").style.display = "none";
document.getElementById("Tracks1").style.display = "block";
document.getElementById("st1").style.display = "none";
document.getElementById("st2").style.display = "inline";
};

var fnMouseOver2 = function()
{
document.getElementById("Tracks2").style.display = "block";
document.getElementById("Tracks1").style.display = "none";
document.getElementById("st1").style.display = "inline";
document.getElementById("st2").style.display = "none";
};

window.onload = function()
{
if(document.getElementById("st1").addEventListener )
{
document.getElementById("st1").addEventListener('mouseover',fnMouseOver1,true);
document.getElementById("st2").addEventListener('mouseover',fnMouseOver2,true);
}
else if ( document.getElementById("st1").attachEvent )
{
document.getElementById("st1").attachEvent('mouseover',fnMouseOver1);
document.getElementById("st2").attachEvent('mouseover',fnMouseOver2);
};
}

Keep in mind that some browsers, like IE5/Mac don't support either of those event models -- they only support the DOM0 event model.

document.getElementById("st1").attachEvent('mouseover',fnMouseOver1);
document.getElementById("st2").attachEvent('mouseover',fnMouseOver2);
should be
document.getElementById("st1").attachEvent('onmouseover',fnMouseOver1);
document.getElementById("st2").attachEvent('onmouseover',fnMouseOver2);

Thanks. I feel like a real noob for not spotting that :rolleyes:

Chris

Why? The two event models handle that differently. It's easy to make an incorrect assumption that they would handle that the same way.

You're welcome :)

Most of the time the simple, trusty and crossbrowser DOM 0 methods do very all kinda jobs, including this one:

document.getElementById("st1").onmouseover=fnMouseOver1;
document.getElementById("st2").onmouseover=fnMouseOver2;

;)

Thanks for that. The simpler things are the more I like it :thumbsup:

hello all,
I know this is a wrong place to place this post .. but i cudnt find a better one.. i was searching for some design details or some kind of pseudo code which would help in handling events from the browser end.. this event handling is mainly for the browser for a handheld device..
can i get some help or lead on the same ..
:)

Give us more details. And better simple start a new thread with this problem.

thanx for showing interest...
I was actually working on builiding the event handling module for a mobile intrenet browser.. so i was kind of looking for how in general event handling happens in a browser(preferably mobile browser)... so any inputs on the code flow from capturing of events till execution of scripts or similar things would be helpful...
can i get any information on the design and flow......:confused:

Unfortunatelly, the event capture/handling codes are different and works different from a browser type to another. What kinda browser are u to use on?

I am working on developing a browser for mobile device, currently its on wince platform and this browser would be mainly used for handheld devices like pda or mobile phones...
i assume the capturing of the events would be different based on the ui we have whereas the handling would have some kind of standard flow.
so putting it across its basically a browser for handheld device.. hope some more light would be shed by u on the same..
:)