Jump to:

5513 Posts in 1732 Topics by 1218 members

Customising the CMS

SilverStripe Forums » Customising the CMS » Drop menu problem in IE - [SOLVED]

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1 2
Go to End
Author Topic: 3224 Views
  • Web Designer Perth
    Avatar
    Community Member
    49 Posts

    Drop menu problem in IE - [SOLVED] Link to this post

    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.

  • Aram
    Avatar
    Community Member
    598 Posts

    Re: Drop menu problem in IE - [SOLVED] Link to this post

    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

  • Web Designer Perth
    Avatar
    Community Member
    49 Posts

    Re: Drop menu problem in IE - [SOLVED] Link to this post

    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

  • Aram
    Avatar
    Community Member
    598 Posts

    Re: Drop menu problem in IE - [SOLVED] Link to this post

    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)

  • Web Designer Perth
    Avatar
    Community Member
    49 Posts

    Re: Drop menu problem in IE - [SOLVED] Link to this post

    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>

  • Aram
    Avatar
    Community Member
    598 Posts

    Re: Drop menu problem in IE - [SOLVED] Link to this post

    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

  • Web Designer Perth
    Avatar
    Community Member
    49 Posts

    Re: Drop menu problem in IE - [SOLVED] Link to this post

    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

  • Aram
    Avatar
    Community Member
    598 Posts

    Re: Drop menu problem in IE - [SOLVED] Link to this post

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

    Glad I could help

    3224 Views
Page: 1 2
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.