Javascript won't behave

[Tech198]

Hi all

My mate has a website, the menu system is javascript driven, with 1 menu deep.

When the user goes over thiese menus, the drop dows(s) appear in IE (havan't checked on Mac yet), and it works *briefly* on iPad.

However, the drop-down apeears for a second upon the tap, before the page refreshes to show the first link in the drop menu.

The menu headings are not linked at all, and just drop down menus,

However, they "appear" as linked on the the ipad.

Can anyone tell me why this happens? Its just javascript...

[960design]

Online example? I'm having a hard time picturing what is happening.

Just a random guess: iPad doesn't have a :hover, could the javascript or css? be acting on this?

just guessing

[Tech198]

Website is :- www.chromagrafx.com.au

[960design]

Yep, pretty common mistake.

<td width="107" align="center"><a onmouseover="cFrame.ShowMenu('Group003', 0, 0, false,'mb3|3',0);" onmouseout="cFrame.tHideAll();" href="stationery.asp"><img src="images/mb3.jpg" width=107 height=25 border=0 name="mb3"></a></td>

Eeek! Tables for design, very bad!!

Notice the "onmouseover"; that's the javascript waiting for the the mouse to hover over the button. Probably will not work so well with touch devices ( pretty much every mobile platform in existence now ).

Ask your mate to read up on mobile compatibility, this will get them started: http://developer.apple.com/library/i...ingEvents.html

good luck

PS For a quick fix you can just use a menu Subject Title that links to # to replace the stationary for example, that way hover should still pull up dropdown, click events for mobile will also display the rest of the menu without actually redirecting the user

[jsm4182]

The coding on that site is pretty bad.

Javascript isn't needed to create a dropdown like that, if it was done just using CSS it would work across all major browsers including the iPad.