SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2010
    Posts
    79
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS menu breaks in IE 7 and 8

    Hi there,

    I'm new to Sitepoint. I have a question about a horizontal CSS menu I am creating (it uses the Superfish jquery plugin too).

    <snip />


    In Firefox, Safari, and Chrome, it parses beautifully. However, in IE 7 and 8, there seems to be a massive problem (and it looks like it has something to do with the submenus). Unfortunately, as I was developing the menu, I was only checking it in browsers like Firefox, Safari, and Chrome. During the development process, I wasn't making sure it was parsing correctly in IE 7 and 8. So I am unaware at which point it "broke" in IE. Since I am not an IE bug expert, I am completely stumped.


    Do you guys have any recommendations as to how to fix this? I've noticed that this forum is full of skilled and professional people, so I thought I'd ask here before I shoot myself.

    Oh, IE...
    Last edited by Paul O'B; Mar 7, 2010 at 11:47. Reason: link removed

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Hi, I'm viewing in IE7/FF. What exactly seems to be the problem? Can you screenshot it?
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2010
    Posts
    79
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmm... wait. This is really weird. It actually works in IE8. I could almost swear that, just yesterday, as I checked it in IE8, it totally died.

    Weird. Ok... there's still one problem in IE7 though. The submenus don't "drop down" when you hover over the tabs. Any ideas as to why?

  4. #4
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    I have to go to work but perhaps it's a sticky bug
    li:hover{visibility:visible;}

    If not then sorry, gotta run

    If that isn't it .. then don't do display:none/block and visibility:hidden/visibie

    Just hide it with a huge negative left margin and set it to 0 on hover (also set left:0)
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,802
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    Hi,

    IE7 is giving a javascript error and it seems you have one too many commas.

    Code:
    <script type="text/javascript"> 
     
        $(document).ready(function(){
            $('ul#navlinks').superfish({ 
                hoverClass:  'hover',
                delay:       550,
                animation:   {opacity:'show',height:'show'},
                speed:       'fast',
                disableHI:   true,
                autoArrows:  false
            });
        }); 
    </script>
    There should be no comma after the false on the last item as shown above.

    That should allow IE7 to start working.

    You don't seem to have added the pngfix correctly for IE6 either and the drop down isn't working in IE6 but you never mentioned if you were supporting IE6 anyway.
    Last edited by Paul O'B; Mar 7, 2010 at 11:43.

  6. #6
    SitePoint Enthusiast
    Join Date
    Mar 2010
    Posts
    79
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys. It did happen to be an error with the Javascript. In PHP, the extra comma in an array doesn't make a difference. Didn't know it did in Javascript.

    IE 7 and 8 are good to go. I am dropping support for IE 6.

    Also @Paul, I am aware of the pngfix issue.

    Thanks again, all! This place rocks!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •