IE6 only applies onmouseover or onmouseout once and only while loading

[csbdeady]

I have the following code on my page:

<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT"> 
<!-- 
function hidesubmenu() 
{
	document.getElementById('subdisplayrow').style.display='none'; 
} 
function showsubmenu() 
{ 
	document.getElementById('subdisplayrow').style.display='block'; 
} 
//--> 
</SCRIPT>

In IE7, FF3 and Safari 3 when I onmouseout from any menu element on the page the function showsubmenu() is called.

In IE6 the showsubmenu() function is only called if I onmouseover and onmouseout while the page is still loading.

What could cause this? I obviously have an error in my logic somewhere.

The page is located at

http://dev.whatgreencar.com

.

Many thanks in advance
-Colin

 

[feherke]

Hi

I have a fundamental difficulty in debugging that page : I found no element with [tt]id[/tt] subdisplayrow. Where should that be ?

Feherke.

http://rootshell.be/~feherke/

 

[csbdeady]

Ahh yes, my mistake - I should have said that if you click on a link that has a sub menu, ie: Award -> About the Award then the ID is created just for the tab that you have selected the sub menu under.

That way there is only ever one subdisplayrow ID on the page, hence the above code will apply to it (as it does in IE7 and FF3, but not IE6, hence my original problem).

I do appreciate that IE7 generates a javascript error alert at the bottom of the page when the ID is not available, which is valid, but the design is correct in this regards due to the intended functionality.
-Colin

 

[BillyRayPreachersSon]

I don't understand the problem. If I do just what you've said:

1. Click 'Award 2008'
2. Click 'About the award'

I get taken to a page and I see no JS errors. I also see no submenu. Is that the problem? Also if I omit the last click, the submenu hides fine for me (again in IE6).

Can you describe the problem better / more in depth?

Also check out the site in Fx2 with an ad blocker installed - it looks so broken, you cannot even see the header and the content is all over the place. You should not rely on your ads being present to dictate the layout of your site, as many people would see a broken site! (you can emulate this by deleting your 'leaderboard' and 'home-mpu' DIVs).

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[csbdeady]

Thanks Dan, your comments are appreciated. Regarding FF2 we are aware of display issues but a business decision not to support FF2 with this site has been taken given the low market share of FF2 (due to the rapid uptake of FF3).

Back to the original problem: if I describe what happens in IE7 versus IE6 then it may be clearer what the problem is.

IE7 (correct behaviour):

1) Load the site -> Home tab is green, all others grey, no submenus shown.
2) Mouseover Green Car Guide -> sub menu for Green Car Guide shown.
3) Click Petrol and Diesel in the sub menu -> Page reloads with Green Car Guide as a green tab, Home is back to a grey tab, and the submenu is visible showing Petrol and Diesel with a white underline.
4) Mouseover Home tab -> Home tab is green, Green Car Guide stays green, submenu disappears.
5) Mouseout Home -> Home tab is grey, Green Car Guide stays green, submenu for Green Car Guide REAPPEARS.

Contrast this with IE6 (incorrect behaviour):

Steps 1-4 -> same as IE7
5) Mouseout Home -> Home tab is grey, Green Car Guide stays green, submenu for Green Car Guide DOES NOT reappear.

As a test I temporarily modified the code to add window.alert('desired_action') to the two functions described in my original post and I can see that in all bar IE6 the alerts pop-up and are shown, but in IE6 they are not. However in IE6 if I mouseover and mouseout quickly before the page has finished loading then the mouseout will occur once - it appears that once the page has loaded the functions are no longer called for these two events in IE6.

This applies to any of the tabs, eg: if I am showing the Award 2008 submenu then it correctly disappears and reappears with onmouseover and onmouseout in IE7 (and FF3 and Safari 3) but the Javascript function call to show the submenu again is not processed (or is not processed correctly...?) in IE6, hence no re-display of the submenu.

Hope that helps clarify it all.
-Colin

 

[BillyRayPreachersSon]

Regarding FF2 we are aware of display issues but a business decision not to support FF2 with this site has been taken given the low market share of FF2 (due to the rapid uptake of FF3).

The problem also happens in Fx3, and of the Fx 2/3 users, the 50/50 switch has only just happened in the last month or so anyway - 2 good reasons to think again.

Anyway - I removed the reference to loading 'ie.js' and all worked as expected.

Hope this helps,
Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[csbdeady]

Thanks Dan - ahhh yes ie.js was left over from the previous site design and I forgot to remove *hangs head in shame*. Many thanks for spotting this! Have a virtual beverage of your choice on me

I do see what you mean about ad blockers. Funny thing is the header does have a fixed height, but this is messed around with by ad blockers it seems (ho hum). However that's not my call to address in this case.

Also, personally whilst I have no problem with pop-up ad blockers (as they seem to take the concept of commercial ads one step too far) I do not mind ads inside web pages themselves. This is because the majority of sites are ad funded - remove the ads and the site loses revenue. Too great a loss of revenue can therefore cause some sites to fail. It's a bit like tragedy of the commons when some people try to gain from suppressing the ads while still relying on others to see the ads and thus keep a site going.

FF3 seems just about usable to me with an ad blocker installed. Plus if someone really wants to see all of a commercial site then they ought not be trying to get content, which cost money to put online, without accepting the ads. Think of it like commercial TV - you may hate the ads, BUT they fund the programs, ie: no ads = no programs.

I guess the above is a philosophical debate for another time and another thread

Thanks again
-Colin

 

[BillyRayPreachersSon]

I really think that taking 5 minutes to fix your markup / CSS to display nicely for people with ad blockers isn't too much to ask to create a more professional looking site - and it should be only 5 minutes to clear a few floats.

Read these for information on how to do this:

http://www.positioniseverything.net/easyclearing.html

http://www.sitepoint.com/blogs/2005/02/26/simple-clearing-of-floats

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Tech Snippets & Info:

http://www.codecouch.com/

 

[csbdeady]

Thanks for your thoughts on the matter Dan.
-Colin