View Full Version : IE 7 and IE 6 UL dropdown problems

12-01-2009, 12:27 AM
on this site, http://www.pooltees.com, the dropdowns within the top nav bar aren't working in IE 6 or 7 like they are in IE 8.

In IE 7, the dropdown menu does not appear immediately below its heading (Mens Gear or Womens Gear) when you hover over the headings. Instead it appears up and to the right of the headings, not below them.

And in IE 6, the dropdowns don't even appear!

please advise how i fix these two issues. i'm stumped. thanks!

12-01-2009, 07:16 AM
To make a drop down effect in IE6, you need to add a small javascript fix, see http://www.htmldog.com/articles/suckerfish/dropdowns/

12-01-2009, 09:07 AM
To make a drop down effect in IE6, you need to add a small javascript fix, see http://www.htmldog.com/articles/suckerfish/dropdowns/

Thanks, that accidentally helped me to solve one issue with my project.

12-01-2009, 03:39 PM
thanks. abduraooft. i tried the fix, but it doesnt seem to have worked. here's the page where i applied the code: http://www.pooltees.com/other_products/balabushka_cues.html

my IE6 style sheet has the following:

#hor_nav li:hover ul, #hor_nav li.sfhover ul {
left: auto;

and i put the following below the close Head tag in the HTML (perhaps i did something wrong in this part???):

<!-- begin IE6 Dropdown Fix -->
<script type="text/javascript"><!--//--><![CDATA[//><!--

sfHover = function() {
var sfEls = document.getElementById("hor_nav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
if (window.attachEvent) window.attachEvent("onload", sfHover);

<!-- End IE6 Dropdown Fix -->

please advise. thanks!

12-01-2009, 10:41 PM
more importantly though, any idea why i have the IE7 problem whereby the dropdowns dont appear immediately below their respective headings?

please advise. thanks.

12-02-2009, 07:06 AM
#hor_nav ul li ul {
background-color: #FFFFFF;
width: 310px;
border: 1px solid #009900;
min-height: 110px;
#hor_nav li:hover ul,#hor_nav li.sfhover ul {

12-02-2009, 05:21 PM
thank you. that does seem to have done the trick in IE7. the only thing is, the appearnance of the dropdown is very "tempermental". when i scroll over the heading, the dropdown appears, but half the time, when i then move the cursor down to select one of the items within the dropdown, the whole dropdown disappears.

any thoughts on how to fix? thanks!

12-03-2009, 07:08 AM
any thoughts on how to fix? thanks! You might need to decrease that top value for a fraction.

12-03-2009, 04:05 PM
you're smart. :D thanks!

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum