I have implemented a suckerfish drop menu and it works fine in all my Mac browsers (my PC is off-site being fixed _again_).

Client, using IE8, reports drop menus appear OK but then do not collapse.

However everything functions as expected here: http://htmldog.com/articles/suckerfish/dropdowns/example/

I have Googled, tried many tweaks, but the problem persists and I'm going a little craaaaazy...

If you could spare a moment to have a look - In IE8 and 7 - I would really appreciate it.

Edit: Link removed.

Hi

It seems to be broken in both IE8 and 7, the menus appear, but then they don't dissapear so you get a buildup of menus on the screen as you open them. The Suckerfish page works fine though.

I am not big on pure JS (I tend to stick to jQuery) but i do notice that there is a missing \ from the end of the mouse out command when compared to the suckerfish page:

Suckerfish: this.className=this.className.replace(new RegExp(" sfhover\\b"), "");

Yours: this.className=this.className.replace(new RegExp(" sfhover\b"), "");

Might be nothing, but I thought I'd point it out.

On another note, did you ahve to do anything to get SS to work with that dev address? I can only seem to get static sites to work with an IP/~username URL, SS sites just give me a 404 error. I suspect it might me something to do with the htaccess file.....any ideas?

Thanks

Aram

Thanks so far Aram.

Very strange. It seems that second slash is somehow being stripped out. It's there in the head in my templates like this:

<script type="text/javascript"><!--//--><![CDATA[//><!--
		sfHover = function() {
		var sfEls = document.getElementById("nav").getElementsByTagName("LI");
		for (var i=0; i<sfEls.length; i++) {
		sfEls.onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls.onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
//--><!]]></script>

But not there when I do a 'view source' in browser ?????

Any ideas? I gotta get this fixed and soon.

Since I guess it's the mouseout bit that's broken I bet it's got something to do with this slash...

Re. your question. This is from our htaccess file:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /~sjshirew

Hmm, have you tried inserting it as a: Requirements::customScript(' [Script goes here] '); in your innit function? that should work....

alternatively you could (and probably should) rewrite it in jQuery:

			
				jQuery(document).ready(function() {
					jQuery("#nav li").hover(
					function(){
					    jQuery(this).addClass("sfhover");
					},function(){
					    jQuery(this).removeClass("sfhover");
					});
				});

That should work....havnt tested it though, but I'm pretty sure it does the same thing (i.e. adds and removes the class on hover)

I _really_ appreciate your help. This has been driving me crazy for days.

However, when I insert this in the head of my homepage template I get error "jQuery is not defined"

<script type="text/javascript"><!--//--><![CDATA[//><!--
		jQuery(document).ready(function() {
               jQuery("#nav li").hover(
               function(){
                jQuery(this).addClass("sfhover");
               },function(){
                jQuery(this).removeClass("sfhover");
               });
            });
//--><!]]></script>

try adding this above it:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

This will load the jQuery library, which has to be loaded before you run the script.

Oh and I forgot to say thanks for the tip on the htaccess, that will help me out :)

I've done that - homepage template only so far.

Does it work in IE7 and 8 now?

No worries re. htaccess tip. I reckon I owe you a couple of beers already :)

It sure does! Works like a charm, even in IE6!

Glad I could help :)