CodeCanyon

Drop down menu in ie9 not working

7 posts
  • Bought between 10 and 49 items
  • Has been a member for 1-2 years
scottzoe says

Hello

I am having a drop down menu problem in ie9. this is the site: http://aogheliservices.com/AOG-WEBSITE-2012/index.html

Java Script file:

$(function(){
$(document).ready(function(){
    // Sub nav functions
    $("ul.top-nav a").hover(function() {
        $(this).parent().find("ul.sub-nav").slideDown(100);
        $(this).parent().hover(function() {
        }, function(){
            $(this).parent().find("ul.sub-nav").slideUp(100);
        });
    });
});
// Sub sub nav functions
$("ul.sub-nav a").hover(function() {
    $(this).parent().find("ul.sub-sub-nav").show();
    $(this).parent().hover(function() {
    }, function(){
        $(this).parent().find("ul.sub-sub-nav").hide();
    });
});
});

Css file:

/* Main Nav Elements /
  • { outline: none; }

nav {

width: 683px; margin: 0 auto; border: 0px solid #000000; font-family: Verdana, Arial, Helvetica, sans-serif; font-style: italic; font-weight: bold; }

ul.top-nav, ul.sub-nav, ul.sub-sub-nav { display: block; list-style: none; padding: 0; margin: 0; }

ul.top-nav > li { float: left; display: block; position: relative; top: 0; }

ul.top-nav > li > a { float: left; height: 27px; padding: 10px 12px 0 12px; font-size:12px; color: #fff; text-decoration: none; border-right: 1px dotted #7d7d7d; white-space: nowrap; background: #dcdada url(../images/nav/mainnav_bg.png) top left repeat-x; }

ul.top-nav li a:hover { background: url(../images/nav/mainnav_hover_bg.png); color: red; }

.no-border { border: 0 !important; }

/

Sub Nav Elements / ul.sub-nav, ul.sub-sub-nav { display: none; }

ul.sub-nav { position: absolute; top: 35px; left: 0; width: auto; min-width: 200px; background: grey; border: 1px solid #ddd; border-top: 1px solid #000; }

ul.sub-nav li { display: block; position: relative; }

/

text / ul.sub-nav li a, ul.sub-sub-nav li a { display: block; padding: 8px 4px; margin: 0; background: none; color: white; font-size: 12px; border: none; text-decoration: none; white-space: nowrap; }

ul.sub-nav li a:hover, ul.sub-sub-nav li a:hover { background: #dcdada; }

/

Sub Sub Nav Elements flyouts / ul.sub-sub-nav { position: absolute; top: 0; left: 220px; width: auto; min-width: 220px; background: #006B8F; border: 1px solid #ddd; }

/

Misc Elements */ .clear { font-size: 0px; line-height: 0px; height: 0px; width: 0px; clear: both; }

Can anyone please help? Scott

2900 posts
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
  • Community Moderator
  • Bought between 50 and 99 items
  • Referred between 1000 and 1999 users
  • Has been a member for 3-4 years
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
+4 more
sevenspark moderator says

Hi Scott,

You need to declare a doctype in your HTML , before the first html tag. Since you haven’t, IE renders the document in quirks mode (essentially as IE6 ), which, as you can see, doesn’t work very well ;)

Hope that helps,

Chris

7 posts
  • Bought between 10 and 49 items
  • Has been a member for 1-2 years
scottzoe says

So i had : <!DOCTYPE HTML PUBLIC ”-//W3C//DTD HTML 4 .01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”>

in the first one and it made no difference… any other ideas?

2900 posts
  • Elite Author
  • Sold between 250 000 and 1 000 000 dollars
  • Community Moderator
  • Bought between 50 and 99 items
  • Referred between 1000 and 1999 users
  • Has been a member for 3-4 years
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
+4 more
sevenspark moderator says

You’re running in quirks mode http://www.quirksmode.org/css/quirksmode.html

Use a strict (or “almost strict”) doctype.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
7 posts
  • Bought between 10 and 49 items
  • Has been a member for 1-2 years
scottzoe says

Hey sevenspark Tried what you last suggested and still not working? I am not sure what is up with this…

Any other ideas?

http://aogheliservices.com/AOG-WEBSITE-2012/index.html
by
by
by
by
by