a fix for suckerfish dropdowns in ie 7

a fix for suckerfish dropdowns in ie 7 built from source. web stuff. home about the zend certification exam oct 23 a fix for suckerfish dropdowns in ie 7 internet explorer, bugs, css add comments internet explorer 7 is a welcome upgrade from ie 6, but it still has its share of display issues—and some new ones besides. recently, i ran across one that falls in the latter category. although patrick griffiths and dan webb’s suckerfish dropdowns (and their follow-up, son of suckerfish) work fine in ie 6, they more or less choke and die in ie 7. the problem is this: if you change focus within the browser (by clicking in a text field, for example, or somewhere on the background), then move back across the dropdowns, you’ll notice that all the menus “stick”—they don’t go away. in other words, they don’t refresh when the onmouseout event is fired, even though the special “hover” class is removed. luckily, the fix for this is pretty simple. assuming your unordered list menu id is “menu”, you just need to add the following code to your stylesheet: #menu li:hover, #menu li.hover {     position: static; } voilà, he says with proper grave accent! problem fixed. 96 responses to “a fix for suckerfish dropdowns in ie 7” david d says: october 23rd, 2006 at 9:05 pm have you tried this solution in firefox? i’m getting the same “sticky” menus on firefox that i was getting in ie7 before. deborah says: october 24th, 2006 at 8:48 am matt, thanks! your timing on this was amazing. i was reading the css mailing list, and saw your response about the fix for suckerfish menus. i had done some testing last week with ie7, but somehow the sticky menu issue didn’t appear. did my testing this morning, after reading your comment. of course, the lovely bug appeared. i added your fix to my css file and all is working well. have you implemented the change on any of your sites? any other issues you’ve discovered with the suckerfish menus? i did extensive testing this morning, but didn’t uncover any other issues. matt says: october 24th, 2006 at 9:26 am @david d we use suckerfish dropdowns for a variety of sites, and luckily the only issue we’ve come across is in ie 7. it sounds like what you’re experiencing might be another issue..? @deborah yes, we’ve implemented the change on all of our sites, and it works great. no other issues to report as of yet. deborah says: october 27th, 2006 at 6:24 am matt, i just tested this under safari 2.0, and it doesn’t appear that the fix is working. what were the results of your testing under safari 2.0 in mac os 10.4? matt says: october 27th, 2006 at 10:26 am hmm, sounds like a different issue. one of our designers (the one who originally showed me the problem) uses safari 2 for all of his design work, and he hasn’t had an issue with it before or after the change. deborah says: october 29th, 2006 at 4:07 am matt, i ended up using conditional comments to target ie7 for the fix. applying the two line fix directly to the css caused the safari 2.0 menus to have the sticky behavior seen in ie7 before the fix. just curious, how did your designers apply the fix? matt says: october 29th, 2006 at 9:02 am he just put it directly into the dropdown css, which he imports in his main stylesheet. the conditional comments fix is a good solution, though. i usually do something like this for all internet explorer-specific fixes: <!--[if ie]> <style type="text/stylesheet"> @import url("/styles/application-ie.css"); </style> <![endif]--> lloyd borrett says: november 1st, 2006 at 12:05 am i wish this fix was working for me. but after trying quite a few combinations and permutations, i still can’t get it to work. any help would be much appreciated. best regards, lloyd borrett. robin says: november 1st, 2006 at 10:30 am matt, thanks for this! spent most of the day struggling with this bug then finally happened across this post. if you’re ever over in the uk let me know and i’ll buy you a pint john says: november 2nd, 2006 at 9:06 am i had that problem in ie6 with the original suckerfish menu. it occurred if there was a displaced background with no background colour assigned to the area behind the menu - but only if the page was displayed in a frame. i think this was to do with the way that ie refreshes a page. once i assigned a colour (white as it happened) to the entire background, the problem was resolved - and it does not occur in ie7. the problem i am getting with ie7 is that the menu (which is down the left hand side of the page - not across the top) works ok until the user zooms in or out. on settings other than 100%, the sub-menus that open are not in the correct position. has anyone encountered that? chris says: november 17th, 2006 at 10:37 am thanks for the fix. works nicely. yet to test on mac though, btu will get round to that next week. i’ve also just stumbled accross the problem with the secondary ’s scaling their left margins when zoomed in ie7 too. why can’t they just stick to the same standards as everyone else. grrr! any ideas on this one? matt says: november 17th, 2006 at 11:06 am our lead designer asked me the same thing. the only option i can see with that is to use javascript. it would check the current font size, compare it to the initial size, and adjust the secondary menu margins accordingly. in other words, not worth the effort. eric says: november 18th, 2006 at 8:13 am great. simple as it is. thank you. lucas says: november 20th, 2006 at 10:20 pm the fix works great for ie7 in firefox, ie6, and opera the menus still work great after applying the fix, but it seems to send safari bonkers. i’m not too sure if i’m concerned about that though, as i mainly use the menus on our company intranet. matt says: november 21st, 2006 at 10:41 am works for me on safari 1.3.2+ (which includes 2.x). older versions may have issues, but i can’t test those at the moment. sam says: november 22nd, 2006 at 8:18 pm many thanks, matt. i was bummed to discover the ie7 suckerfish bug, but this is such an easy fix, i can’t complain. i’ve only used it on one site so far, but haven’t experienced any problems in my testing. subbu says: november 30th, 2006 at 11:31 am thanks a ton.. this works fine. my only concern is that with all the javascript and fixes for the menu to work over , the menu itself is running slow in ie namelessmike says: december 1st, 2006 at 4:02 pm thank you for sharing this. i was down to my last chunk of hair. amrit says: december 14th, 2006 at 1:35 pm hey there, i have a problem with this suckerfish menu which is embedded to a joomlaart template called ja_zibal in internet explorer. in firefox; despite having a sub level menu or not; the wordings/text is clickable (e.g. home to committee 06/07) wherelse in ie it doesn’t and only the menu of “states” work in ie. can anyone help me here please? regards, amrit chrisw says: december 23rd, 2006 at 2:35 am this is a great fix to part of the problem i have. * i am seeing the same problem as the other chris when viewing other than at 100% * my dropdown doesn’t appear below the menu header, but beside it. the fix “cures” one problem by making the dropdown to lie over the neighbouring menu header, but it is still in the wrong place. see www.almoreltd.com for a menu with the fix in place and www.onemoretime.biz for one without. best chris adrian says: january 3rd, 2007 at 7:10 am has anyone sorted this positioning thing in ie 7 yet gerry quach says: january 7th, 2007 at 11:00 pm hi folks, the “ie7 suckerfish 3rd level menu positioning problem when font size is greater than 100%” can be solved if you set your lists to “position: fixed”, e.g. #dropdownmenu li:hover ul, #dropdownmenu li li:hover ul, #dropdownmenu li li li:hover ul, #dropdownmenu li.sfhover ul, #dropdownmenu li li.sfhover ul, #dropdownmenu li li li.sfhover ul { position: fixed; } however, you should only set “position: fixed” for ie7, as earlier versions of ie will choke on this, thus you should target this browser specifically using a conditional comment or similar. one caveat is that the ie7 whole screen zoom feature won’t work properly if you use “position: fixed” property — the 3rd level menu stays at the default zoom whereas the 2nd level menu will be zoomed in. however, if you increase text size via the “view | text size” menu option, then the submenu will display at the correct text size. this fix is working for me, but hopefully someone can come up with a more elegant solution which doesn’t require ie7-specific css. gerry quach says: january 7th, 2007 at 11:04 pm p.s. i should add that the above solution also fixes the original ie7 bug with the focus and onmouseout sticky. thanks to matt for sharing the original fix! maxelcat says: january 18th, 2007 at 2:32 am hi been gonig bonkers with this. your little fix seemed to work immediately. works fine in ff, ns ie6/7. haven’t been able to test out safari at all but hey! thanks (ps now want to know how it works) mike says: january 18th, 2007 at 8:10 am thanks for fix, it’s been bugging me all day! adolph trudeau says: january 23rd, 2007 at 10:26 am hi guys, i had the “appearing to the side” issue too. it had to do with an opera fix-hack. i removed it and things worked fine. opera folk haven’t started complaining. adolph trudeau says: january 23rd, 2007 at 10:49 am these were the offending lines: #navigation li > ul { /*positioning hack for non ie/win ua */ top: auto; left: auto; } andrew says: january 23rd, 2007 at 11:23 am the only fix is a javascript one, since all of these css “fixes” break the display in other browsers. the real problem here is that ie7 is not firing the onmouseout event at all for individual list items. therefore, the only reliable way is to use browser sniffing (ick), in combination with using onmouseleave: sfhover = function() { var sfels = document.getelementbyid("menu").getelementsbytagname("li"); // for each list item in the menu... for (var i=0; i andrew says: january 23rd, 2007 at 11:29 am edit please ^^ thx matt says: january 23rd, 2007 at 12:12 pm @andrew sorry, i can’t fix the code snippet. your post just suddenly ends. ie 7 does in fact fire the onmouseout event. the list item class is changed (”hover” is removed). the problem is that ie doesn’t re-render the list items without declaring a position like “static”. although i tried the fix in all the common browsers (ie, firefox, safari, opera) without any issue, if it is a concern you can combine this fix with conditional comments so that only ie 7 “sees” the css. audrey says: january 23rd, 2007 at 1:24 pm any idea why my drop downs don’t show up in ie7? i followed the son of suckerfish instructions and can’t figure out what i’m doing wrong. work fine in firefox although i would like to eliminate the space between the main nav and drop downs. any suggestions? thanks! audrey says: january 23rd, 2007 at 1:52 pm nevermind, found the problem..thanks! gerry quach says: january 26th, 2007 at 8:53 am @andrew: the css fixes presented above work in ie7 and all modern browsers including opera, safari, firefox. it’s not working in ie5/mac, but that’s no surprise. i’ve tested it extensively and we’re using css suckerfish menus with 3 levels on our intranet, and it’s working fine. at least, my solution is — i can’t comment on any other variations. as usual, you’ll need to cater for ie5/win by serving slightly different css to it, but that’s standard anyway. there’s no need for additional complex js. andrew says: january 29th, 2007 at 9:11 am hm… it must just be my variaiton that isn’t liking these fixes. i’ll side on a future-friendly solution over sniffing anyday, so i’ll revisit my homegrown method and compare with more widely used hybrid techniques out there. hi, my name is al » new and improved… says: january 31st, 2007 at 4:11 am […] im not sure exactly how to trigger the error, dan was getting it by rapidly mousing on and off the menu clicking. changing focus then rolling over the menu. luckily, the solution is quite easy. i found it at built from source. for anyone that doesnt want to click through, here: […] brandonjp says: february 2nd, 2007 at 3:02 pm blahhh….i finally got the menu to show up in ie, but now in ie7 the sub-menus are detatched - there’s some minorly annoying flicker in opera 9, but for the most part everywhere else (ie 5/5.5/6, ns, ff, etc.) everything seems fine….darn that ie 7….any ideas? http://svsbedford.org/svsweb/ thanks –bp brandonjp says: february 2nd, 2007 at 5:13 pm well…for whatever reason, i found the solution & magically it works in ie7 (and still works everywhere else) - in case anyone else is experiencing the same problem, here’s what i did… in the li > ul it did read ‘left: auto’ - but i changed that to ‘left: 0′ so the new code reads: li > ul { top: 1.65em; left: 0; } i guess since ie now reads the child in v7 it was getting confused - i thought i’d tried that already but as long as it works, i’m not complaining! –bp andrea says: february 2nd, 2007 at 6:51 pm you just saved me days of frustration. brava! andrew says: february 6th, 2007 at 9:07 pm brandonjp has the answer for the “off to the side” in ie7. works fine now in safari, mac ff, pc ff, ie6 + ie7. thanks fred says: february 8th, 2007 at 12:48 am thank you sooo muck, matt! you are my hero forever and ever tilly says: february 16th, 2007 at 12:43 pm hi, i’m having a “sticky” issue with the dropdowns over an iframe. the only way i can get them to not stick is to move my mouse up and over the button in the frame that they’re in, but when i move down and into the iframe they stick. anyone else having this problem or a suggestion on how to fix (besides getting rid of the iframe)? thanks tilly says: february 16th, 2007 at 12:44 pm forgot to mention… i’m using ie7, they work fine in firefox. ryan says: february 16th, 2007 at 1:43 pm thank you sooo much!!!! i was just about to call it quits until i stumbled this way! = ) jenni richardson says: february 19th, 2007 at 12:05 am i’ve been having this problem with ie6 and 7. thanks for the fix. of course, all of a sudden after fixing it once (using the javascript fix) the suckerfish menu is not appearing in ie6 again. i haven’t bothered checking 7. i can’t figure it out to save my life. here it is: http://peterpixieproductions.com/new/ darren mcmanaway says: february 23rd, 2007 at 7:49 pm anyone have a good fix for the z-index bug in ie? i seem to have fixed the problem in ie5/6 - but now 7 is giving me a headache… any suggestions? long says: february 28th, 2007 at 3:20 am it works!! though i have not tested with many browsers but it fixed the problem in ie7. and still works in ie6, firefox phil says: march 1st, 2007 at 3:12 am to absolutely reproduce the problem of menu not collapsing in ie7, just press control-a in the browser to select all content on the page. now move mouse over to your menu and go up and down. if the menu still works with the entire page selected, you’ve got it fixed. hyder says: march 6th, 2007 at 12:08 am thank you thank you thank you. i new to css and on past projects have always tried to figure out how to make those menus “non-sticky”. now i can go back and fix all the sites ive been building. great work. mark lauder says: march 8th, 2007 at 4:10 am the fix did not work for the site above; the submenus appearing horizontally on the below-left rather than vertically below the top level list items. instead the following worked: css: #topbarlist li:hover ul li {position: static;} /*targeting just the submenu list items*/ this worked for submenus with more than one item, but for some reason not for those with just one - these still ’stuck’. to get round this it was necessary to add empty list items: html: and css: li.empty {font: 0px/0px “lucida grande”, sans serif;} any explanation for this would be much appreciated. thanks to matt for pointing the way. jack says: march 8th, 2007 at 8:18 am here’s an alternative approach. i couldn’t use this fix because i was absolutely positioning the top-level li elements (don’t ask why!). after a long morning’s headache, my fix was to put the suckerfish javascript inside a conditional comment so that ie7 can’t see it. ie7 is supposed to support :hover on all elements so it should work - but it doesn’t! after further googling, i found the magic ingredient. add the following mystic incantation to the standard suckerfish css #nav li:hover ul, #nav li.sfhover ul { left: auto; background-position: 0 0; } working so far - let me know if it works for you - and especially if it doesn’t! more details of the background-position stuff on http://archivist.incutio.com/viewlist/css-discuss/81588 lauras says: march 12th, 2007 at 1:44 pm the fix to suckerfish worked so my menus were no long sticky but now when i hover over the menu it displays horizontally instead of vertically. maniquí says: march 13th, 2007 at 5:34 pm i just want to say that jack’s solution (comment #50) worked like a charm for me. thanks to matt and jack. jd says: march 23rd, 2007 at 8:36 am i’m having a bit of a problem getting this to work now with ie6. in using the original sos menus, i realized that the way i was implementing, it wasn’t xhtml compliant (i use php to include a set of menus, then a divider made of spans, to see go to www.sbschools.org). so i decided to change the menus and css to use classes instead of ids. ff, safari and ie7 all work now, but ie6 has the sticking problem. after moving my hacks to conditional comments on my testing server, still no fix. i did some manipulations to the javascript and it looks like the mouseout function isn’t able to replace the sfhover with nothing, so the menus never revert back. can anyone give me a hint? i’m pretty bad at js, so i don’t know where to go from here. edward says: march 26th, 2007 at 8:50 am hi i have got the lovely son of suckerfish menus to work fine in opera, ff ie6 and ie7. i had to use the position:static fix to get them to work in ie7. it doesn’t work on mac though!!!! i feel a sense of rising panic because a deadline is approaching on this. can anyone help please edward edward says: march 26th, 2007 at 8:54 am whoops forgot to leave offending link www.maxelcat.co.uk/ipc/index.html jd says: march 30th, 2007 at 6:49 am edward, make sure that the position:static rule only applies to ie7, either by making a separate style sheet and using conditional comments to include it or by using: *:first-child+html #menu li:hover, #menu li.hover { position: static; } safari and ff go nuts with the position:static defined. garyb says: march 30th, 2007 at 1:01 pm thanks for this fix. it works exactly as described. i’ve tested it in ie 5.5, 6 & 7, firefox 1.5.011(mac) & 2.0(windows), safari 2.0.4, netscape 7.02 & 8.1.2, and mozilla 1.7.1. my suckerfish menus are simple; perhaps more complicated ones need some browser specific rules but for my current menus, all is good again. doctype is probably very important on how things work. i’m using: !doctype html public “-//w3c//dtd html 4.01 transitional//en” “http://www.w3.org/tr/html4/loose.dtd” jd says: april 2nd, 2007 at 7:14 am o.k., i think i have a solution to my own problem. i just changed the javascript line that replaces the sfhover tag name from the regular expression check to just setting it to “” and it seems to work in ie 6. ryan says: april 2nd, 2007 at 12:29 pm arrgh, none of these fixing are working for me. i’ve tried matt’s fix, and jack’s fix to no avail. here is the url: http://saltstudio.com/client/mountainwater/test/test.htm any ideas?? thanks. don says: april 3rd, 2007 at 10:16 am found you after i found my solution that i document over here: http://htmlfixit.com/?p=1013 i have them working quite well at present. chad says: april 3rd, 2007 at 6:41 pm any idea how to get the dropdown to stay in front of quicktime or flash? i suppose something that could be done to how an “embed” tag works? brent says: april 10th, 2007 at 8:23 am the solution from comment 50 worked on our site, www.barriessports.com . everywhere you have the style: left: auto; you have to add the style: background-position: 0 0; kris says: april 13th, 2007 at 9:29 am hi chad, i had the same problem with my dropdowns going behind my flash movie. a solution is using a javascript file to call movie (which i would do anyway to avoid the “click to activate this control” message) and within the javascript set the param name=”wmode” value=”transparent” syd says: april 13th, 2007 at 12:59 pm holy lord. thank you for this. i have been fighting with this crap for the better part of an afternoon. good work sir. dave glynn says: april 17th, 2007 at 11:53 am hi guys, i’ve just come across this thread and thought someone may be able to help. we’ve completed the above site for a client and used suckerfish for the main nav, the menu looks great and functions well in all but - you’ve guessed it ie7! the problem is a bit different though. if you hover over the items with drop-downs - shop online and information, the drop-down is very sensitive and often disappears when trying to select a sub-option. any help on how to correct this would be greatly appreciated. the css is: .suckertreemenu { font-weight: bold; font-size: small; width: 750px; font-family: verdana, helvetica, arial, sans-serif; text-decoration: none } .suckertreemenu ul { padding-right: 0px; padding-left: 0px; padding-bottom: 0px; margin: 0px; padding-top: 0px; list-style-type: none } .suckertreemenu ul li { display: inline; background: url(../images/bg_top_menu.gif); float: left; line-height: 30px; position: relative } .suckertreemenu ul li a { border-right: #ffffff 1px solid; padding-right: 2px; border-top: #ffffff 1px solid; display: block; padding-left: 2px; padding-bottom: 1px; border-left: #ffffff 0px solid; width: 120px; padding-top: 1px; border-bottom: #ffffff 1px solid } .suckertreemenu ul li ul { display: block; left: 0px; visibility: hidden; position: absolute; top: 1em } .suckertreemenu ul li ul li { display: list-item; float: none } .suckertreemenu ul li ul li ul { left: 159px; top: 0px } .suckertreemenu ul li ul li a { border-right: #ffffff 1px solid; padding-right: 5px; border-top: #ffffff 1px solid; display: block; padding-left: 5px; font-size: small; padding-bottom: 1px; border-left: #ffffff 1px solid; width: 170px; padding-top: 1px; border-bottom: #ffffff 1px solid; font-family: verdana, helvetica, arial, sans-serif; text-decoration: none } .suckertreemenu ul li a:hover { font-size: small; background: url(../images/bg_top_menu_over.gif) #ffc3fe; color: white; font-family: verdana, helvetica, arial, sans-serif; text-decoration: none } .suckertreemenu .mainfoldericon { background: url(../images/bg_top_menu.gif) #ffc3fe; color: white } .suckertreemenu .subfoldericon { background: url(../images/bg_top_menu_over.gif) #ffc3fe; color: white } * html p#iepara { padding-top: 1em } * html .suckertreemenu ul li { float: left; height: 1% } * html .suckertreemenu ul li a { height: 1% } best wishes dave http://www.atomicwebsolutions.com dave glynn says: april 17th, 2007 at 11:55 am apologies guys, the site with the problem is: http://www.tinkerbells-treasures.com best wishes dave duane says: april 27th, 2007 at 1:56 pm thank you so much i have been pulling hairs out of my bald head with this problem and to think its that easy. you rock matt, thank you so much duane says: april 27th, 2007 at 3:15 pm question for you guys. how do i get the menu to show above my swf? i have my website has a flash image that hides the lists when its over it. i have z-index set at 1000 and it still hides underneath flash. any ideas? shane says: may 7th, 2007 at 10:58 am thank you! i’ve been going nuts because of this problem and you had an instant fix… benjamin says: may 29th, 2007 at 7:57 am i don’t know if you can help me with this. i have been searching all over for a fix with my suckerfish dropdowns. my developer cannot get them to allow the image links in my primary navigation bar to show the link in the status/task bar at the bottom of the browser when you put the cursor on them. the dropdown links show there, but not the main nav link itself. this problem occurs in ie 6 and ie7. they work in firefox. any help would be greatly appreciated. the site is http://www.dev52.rewdev.com/ darrick says: may 30th, 2007 at 5:07 pm so, anyone have a code example of a single menu dropdrop that is working in ie7? my submenu’s are shifting to the right and the background-position: 0, 0; is not working for me… i am in css hell. any help would be greatly appreciated. hüseyin tüfekçilerli says: june 7th, 2007 at 4:30 am wow, this saved a lot of pain thnx! matt says: june 11th, 2007 at 7:56 am simply amazing! thank you so much for posting. i am forever grateful. amsterdam frank says: june 12th, 2007 at 3:27 pm thanks all. i will play with this. i guess i am back from a few years of css-hacking. now with ie7 and future crap, i am trying to keep things clear of browser-hacks! the following might be for finetuning. test it yourselves. since sf javascript is only used by ie, why not convert it to jscript with cc’s ? dunno of it works in jscript. but even when it doesnt, you could document.write the regular javascript with jscript non-ie browsers will skipp it, in stead of misunderstanding it (?!) it would also be simpler to catch things like the mac ie5 (5.2). /*@cc_on // suckerfish code here @*/ or /*@cc_on document.write(''+ code here +''); @*/ macintosh: /*@cc_on @if (@_mac) // hello mac @else // hello non-mac @end @*/ you could (in theory) even catch a browser on xbox360 for it uses powerpc and is not mac). don’t know what kind of browser x360 will handle (once it is hacked). the code then could/should be: /*@cc_on @if (!(@_mac)) && @_powerpc) // hello xbox360 @end @*/ also, when i’m seeing users who are in the 5% non-scripting browsers, i like to fall back to some dropdown a la stu nicholls’ www.cssplay.co.uk cheers from amsterdam, frank matt says: june 14th, 2007 at 10:39 am @frank while conditional compilation is useful for javascript applications, it’s probably not the best way to handle conditional css. you would be better off using ie’s own conditional comments. i typically have the general css in one file and ie-specific css (and only ie-specific css, of course) in another. the ie css overrides the general css—the c in “css” stands for “cascading”, after all. <style type="text/css"> @import url('styles.css'); </style> <!--[if lt ie 7]> <style type="text/css"> @import url('styles-ie.css'); </style> <![endif]--> jr says: june 18th, 2007 at 8:22 am @tilly: i’m having the same problem here… suckerfish menu is in an iframe and works fine in all browsers except for ie7… when i’m not in an iframe all browsers (including ie7) seem fine… anyone got any ideas? cheers graham e says: june 28th, 2007 at 7:00 am okay i just got my heavily modded suckerfishes going in ie7. my suckerfish is a single icon at the top right of the page that drops down a list of images which then pop-up horizontal sub-lists of images to the left… complex! they aren’t online sorry - last time i put my testing site up some bots managed to somehow index it and the client complained that people were finding it (yahoo search i think). anyway the code changes which worked for me were conditional comments inserted in an external style sheet: #nav2 li ul { top: 100%; left: 0; } #nav2 li:hover ul { top: 100%; } #nav2 li li:hover ul { top: 0; } my code now works in ies 5+ and gecko browsers. that’s all i can test. hopefully this will give others some useful ideas about things to fiddle with. graham e lloyd says: july 4th, 2007 at 7:05 am thanks for posting this fix - excellent. lucky i found it since not much hair left to pull out… would never have guessed in a million years that position: static would be the answer. i’m back to being all what i want to be today…. empowered by a lovely browser. alan gresley says: july 7th, 2007 at 7:11 am hi all there are quite a few fixes for the sticky dropdowns in ie7. i have an article on my site about this issue that list over 30 fixes, please see. http://css-class.com/articles/explorer/sticky/index.htm there is also an explanation about why it happens, which is due to the left offset values given which hides or shows the submenus. again support for a new selector in ie has bugs. regards, alan rc says: july 19th, 2007 at 12:12 pm my drop down is in development but this fix worked perfectly. thanks julian says: july 24th, 2007 at 1:51 pm this worked! you da man! ivon says: august 17th, 2007 at 1:40 pm can anybody tell me, what file and what you should i change in it so the template ja_zibal displays correctly menu consisting from the two lines? thx billy says: august 23rd, 2007 at 11:40 am thanks- while building a new dropdown for a new site i encountered the stick in ie7. del says: august 24th, 2007 at 7:34 am thank you. this has been quite a pain for some time so this fix will be applied to several websites. fruitwerks says: september 5th, 2007 at 2:07 pm i have a suckerfish style menu on one of my websites > http://sweetskies.fruitwerks.us it works fine in ff and ie7, but there is a total lack of the drop-down in ie6. so far ie6 is only 22% of my hits, but if someone could look and see if they know why it does not work. thanks! ben wells says: september 14th, 2007 at 8:57 am thanks! that worked wonderfully. so simple, i’m glad i began with a search rather than just jumping into it. thanks again - ben joseph nicholas says: october 3rd, 2007 at 9:39 am thank you for the ’static’ trick it saved me too! steph says: october 16th, 2007 at 11:50 am matt, thanks a bunch! i hate to add another “me too”, but seriously, i have been driving myself nuts trying to work up a fix for this and it has been quite frustrating as it not only sticks on forms fields, but also pages with google maps. i’m glad i checked out your site. phew! woop woop! says: october 21st, 2007 at 8:50 am matt, you are the bomb and so happy to see that your testing and tinkering managed to help out so many frustrated folks. peace! j m says: october 29th, 2007 at 1:41 pm hi kris or to whomever is able to help me, i am also experiencing what chad was going through; (comment #61) chad says: april 3rd, 2007 at 6:41 pm any idea how to get the dropdown to stay in front of quicktime or flash? i suppose something that could be done to how an “embed” tag works? ———————————————————————————————————— below is my css that i currently have. pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” width=”420″ height=”127″> link for the website i am experiencing this http://tera-tech.net/ ————————————————————————————————————– i tried what kris said on comment #63 kris says: april 13th, 2007 at 9:29 am hi chad, i had the same problem with my dropdowns going behind my flash movie. a solution is using a javascript file to call movie (which i would do anyway to avoid the “click to activate this control” message) and within the javascript set the param name=”wmode” value=”transparent” —————————————————————————————————————- i am not sure as to where exactly i need to insert it in the script or if i am even on the right place. also if you noticed on my css, it has the as kris suggests to avoid the “click to activate this control” message, and i am still getting that message. any help/suggestions will be very much appreciated. thanks in advance! j m says: october 30th, 2007 at 1:56 pm apparently my css was not posted correctly. here it is: pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” width=”420″ height=”127″> j m says: october 30th, 2007 at 1:58 pm see if this works … … pluginspage=”http://www.macromedia.com/go/getflashplayer” type=”application/x-shockwave-flash” width=”420″ height=”127″> sam says: november 9th, 2007 at 7:19 am works great thanks!! mack says: november 13th, 2007 at 12:52 pm it fixed the sticky drop down problem and also fixed an intermittent problem with a failure to drop down in the first place. thanks jp says: november 13th, 2007 at 6:35 pm if anyone is able to help point out how i can get the dropdown menu to display in ie7 as it does in ie6 please do. i’ve exhausted my options and i’m not sure why it’s not displaying directly under the menu item. the css file is located here: http://www.vooys.ca/quadra/css.css please help. jp says: november 13th, 2007 at 6:35 pm website page is located here: http://www.vooys.ca/quadra/new.html leave a reply name mail (will not be published) website wp theme & icons by n.design studio categories ajax (1) bugs (1) code (2) css (1) firefox (3) frameworks (4) hd (1) internet explorer (3) javascript (5) mozilla (1) php (3) prototype (2) rants (2) safari (2) usability (1) video games (1) windows (3) zend (2) zend framework (2) zendconference2006 (2) archives september 2007 june 2007 april 2007 march 2007 february 2007 january 2007 december 2006 november 2006 october 2006 links meta entries (rss) comments (rss) wordpress login

Acceuil

suivante

a fix for suckerfish dropdowns in ie 7  How to Fix Shows Like 'Lost' -- New York Magazine  Mike Volodarsky's ServerSide : Fix problems with Visual Studio F5 ...  Glisshop :: Conseils ski - Montage fix  FairVote The Center for Voting & Democracy  ONLamp.com -- How to Decide What Bugs to Fix When, Part 1  /IE7/  Google Tries to Fix Broken Links  How To Fix Overexposed Images PhotoshopSupport.com  Konrad Hornschuch AG - d-c-fix, dcfix, skai Klebefolien ...  HYJEK AND FIX, INC.  Daily Herald Officials promise quick fix to state's finance woes  Achat et location Fix Saint Geneys  fix  Sommier LATTOFLEX LT25 Fix 2 pers. 140x190 Ferme / La Compagnie du ...  George Fix  Ablse fix: Bewkes folgt Parson als Time-Warner-Chef  The Draw System  Blackhawk Software :: Registry Fix, Error Fixer, Online Privacy ...  High-performance .NET, C++ and Java FIX Engine Onix Solutions  How To Fix An Underexposed Photo PhotoshopSupport.com  The Fix Bikes - Downhill, Freeride, Dirt Jump, All Mountain ...  Fix for Borland Pascal "Runtime Error 200" bug on fast PCs  Business Objects Customer Assurance - Merge Modules  Quick Fix Meals with Robin Miller - Show List A to Z - TV - Food ...  The Knicks Fix  Microsoft Watch - Server - Microsoft's Fix for the Middle Child ...  fix: Definition, Synonyms and Much More from Answers.com  フィックスレコード公式サイト  zieh fix  The Joy of Flex Blog Archive More on fix to Leopard file ...  SPLANN BLITZ FIX (l'ponge miracle, Eco logis, Eco respect ...  THERMAL FIX - Thermal Fix 2 - Tube  THERMAL FIX - Thermal Fix 1 - Tube  Windows MaxMTU Fix - HelpWithWindows.com  BW Online March 19, 2001 How to Fix America's Schools  Baseball Glove Repair And Restore  how to mend it .com - Find out how to mend just about anything  Actualit sur VJ FIX - Dates de concerts, albums, Mp3, vidos ...  Fix the Future: What this site is all about.  Welcome to Gia's Fix  Fix your mom's computer for mother's day - Joel on Software  CTV.ca Astronauts embark on risk spacewalk to fix sail  3 Ways to Fix Citigroup  [adult swim] Fix Schedule  Resize or Convert Images online  Active Content Developer Center  LUX ELEMENTS- FIX - Jeux de fixation  MIST & FIX - Brume Fixatrice de Maquillage - Fixateur de ...  Alpinisme -- Petites annonces - Re: vends chaussures neuves et fix ...  Vichy Thermal Fix Yeux - 15 ml  Polident Languettes Fix Confort - 40 languettes  Orna Cohen-Fix, Ph.D. : Faculty : NIDDK Laboratories  Inventgeek.com - LCD Backlight Fix - Overview   MG WinSock XP Fix 1.2  Chez Fix  Garbage - Fix Me Now Musique sur Last.fm  Technology News: Space: ISS Astronaut to Perform Perilous ...  M700 Glofiish GPS SiRF III instant fix intgr Smartphone ETEN  Django security fix released  OE-QuoteFix