Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Customising the CMS /

Drop menu problem in IE - [SOLVED]


Go to End
Reply


10 Posts   3416 Views

Avatar
Web Designer Perth

Community Member, 49 Posts

4 November 2009 at 11:26pm

Edited: 10/11/2009 5:05pm

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: [url]http://htmldog.com/articles/suckerfish/dropdowns/example/[/url]

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.

Avatar
Carbon Crayon

Community Member, 598 Posts

9 November 2009 at 1:09am

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

Avatar
Web Designer Perth

Community Member, 49 Posts

9 November 2009 at 11:53am

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

Avatar
Carbon Crayon

Community Member, 598 Posts

9 November 2009 at 1:03pm

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)

Avatar
Web Designer Perth

Community Member, 49 Posts

9 November 2009 at 1:13pm

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>

Avatar
Carbon Crayon

Community Member, 598 Posts

9 November 2009 at 1:30pm

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 :)

Avatar
Web Designer Perth

Community Member, 49 Posts

9 November 2009 at 1:40pm

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 :)

Avatar
Carbon Crayon

Community Member, 598 Posts

9 November 2009 at 1:45pm

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

Glad I could help :)

Go to Top