Dropdown menu not working in IE6 or IE7 works fine in Firefox

I'm stuck with a menu on a site I develop.
http://charlienutting.com

If you hover over the gallery at the top menu bar it should show you a drop down menu.
It works fine in Firefox but sucks in IE6 and IE7.

Really thankful if someone can help.
been about week now to fix this..

edit-
however if you can see there are drop down links which you can click, but those are not visible.

Completely off topic, but, love the design, very elegant! And I like what I see with your use of data-uris :) Fading the images with javascript rather than Flash is also admirable.

– falstro
Jan 21 '09 at 7:55

Nice trick to make traffic on your website.. doing SEO. huh

– A4 Page
Feb 10 '13 at 14:43

4 Answers
4

What happened when you debugged into it in IE? What error messages did you see and what have you tried?

I'm happy to help, but really, you haven't described a problem yet.

Hi, there are no error messages. Its just that I can not see the menu drop down menu in IE and I can see the drop down menu in firefox.

– code_monkey
Jan 21 '09 at 7:16

I guess transparency issue.
perhaps the line in js/dropdown.js that looks like

c.style.filter = 'alpha(opacity=' + ( 100 / c.maxh) + ')';

fire up the script debugger and see what the value of c.maxh is.

I haven't use "script debugger" before. I tried it now. But couldn't figure it out. But in Firebug I can see the correct value for opacity :( But I also suspect this is a opacity issue. But how to figure it out ? I'm totally stuck

– code_monkey
Jan 21 '09 at 7:46

First let me say that you have talent as a designer :)

However, there are a few issues with the site's code as it is. I would recommend dropping that drop down code and implement your own using JQuery's effect library (I say this because you are already loading JQuery in your page). That is browser compatible so you wont have these issues with IE.

http://docs.jquery.com/Effects

Next, your header changes size between Gallery, resume and contact. You will probably want to get that fixed. Also, the resume page's links are positioned odd in FF 3.4... It would be best to make them without using absolute positioning. You can accomplish that by a mix of "float : right" and "position : absolute" (but not setting the "left" or "top" properties) :)

Your page is using a doctype, but doesn't validate.

Oh - and it's 2009 now, BTW :D (see copyright)

hint:

Try setting a doctype. I know I've had issues in the past with hover events without a correct doctype. Your current page sets Internet Explorer to Quirks Mode.

Currently if, in IE9 I set my mode to IE7 and then switch the "Document Mode" from "Quirks Mode" to "Internet Explorer 7" mode, they show up correctly.

Put this at the top of your HTML files and see if setting your doctype will fix the issue:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Thanks for contributing an answer to Stack Overflow!

But avoid …

To learn more, see our tips on writing great answers.

Required, but never shown

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

搜尋此網誌

Dfyjkt