Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 7 of 7
  1. #1
    Member
    Join Date
    Aug 2006
    Posts
    67
    Member #
    13752
    Hi.

    Ive been having big problems getting my extended menu (suckerfish) to work in IE.

    My page will only load in in IE 5.2 (mac) after i take out the suckerfish IE hack (javascript). The page loads on IE 7 but the menu dosnt work.

    http://synthsoundz.com/prime_languages/

    This is the javascript which is causing the issues...
    Code:
    <script type="text/javascript"><!--//--><![CDATA[//><!--
    startList = function() {
    if (document.all&&document.getElementById) {
    navRoot = document.getElementById("mainlevel");
    for (i=0; i<navRoot.childNodes.length; i++) {
    node = navRoot.childNodes[i];
    if (node.nodeName=="LI") {
    node.onmouseover=function() {
    this.className+=" over";
      }
      node.onmouseout=function() {
      this.className=this.className.replace(" over", "");
       }
       }
      }
     }
    }
    window.onload=startList;
    //--<!]]></script>
    Can anyone shed some light on the subject?
    Ive been stewing over this for a number of days!

    Thanks.

  2.  

  3. #2
    Senior Member filburt1's Avatar
    Join Date
    Jul 2002
    Location
    Maryland, US
    Posts
    11,774
    Member #
    3
    Liked
    21 times
    Mine:
    Code:
    function bindSuckerfish(target)
    {
    	target.attachEvent("onmouseover", function()
    	{
    		target.className += " sfhover";
    	});
    	
    	target.attachEvent("onmouseout", function()
    	{
    		target.className = target.className.replace(new RegExp(" sfhover\\b"), "");
    	});
    }
    
    // only IE7 has native XHR support; IE6 and below has attachEvent and no native XHR
    if (window.attachEvent && !window.XMLHttpRequest)
    {
    	window.attachEvent("onload", function()
    	{
    		var lis = document.getElementsByTagName("li");
    		for (var i = 0; i < lis.length; i++)
    		{
    			bindSuckerfish(lis[i]);
    		}
    	});
    }
    filburt1, Web Design Forums.net founder
    Site of the Month contest: submit your site or vote for the winner!

  4. #3
    Member
    Join Date
    Aug 2006
    Posts
    67
    Member #
    13752
    Thanks for the reply.

    i used your code and tested it on IE 5.2 (mac) and i experienced the same problem (page no loading) as i did with my code. Strange!

    ill test it out tomorow on a pc and see if it makes a difference.

    Cheers!

  5. #4
    Senior Member filburt1's Avatar
    Join Date
    Jul 2002
    Location
    Maryland, US
    Posts
    11,774
    Member #
    3
    Liked
    21 times
    Mac IE is total garbage (completely different rendering engine than IE/Windows) and not supported by Microsoft nor used by nearly anybody anymore; no need to support it.
    filburt1, Web Design Forums.net founder
    Site of the Month contest: submit your site or vote for the winner!

  6. #5
    Member
    Join Date
    Aug 2006
    Posts
    67
    Member #
    13752
    Thats good to know!

    i will gladly take your advice and avoid it.

    thanks.

  7. #6
    Member
    Join Date
    Aug 2006
    Posts
    67
    Member #
    13752
    ok ive tried your code and it still doesnt work on IE.
    Which leaves me to assume that it is either an issue with my stylesheet, which is creating the dropdown code or the javascript code is conflicting with some other code somewhere on my joomla site.

    If anyone gets a chance could they perhaps have a look at my css?

    HTML Code:
    /* CSS Document */
    
    /* Top Menu */
    
    #mainlevel ul { /* all lists */
        padding: 0;
        margin: 0;
        list-style:none;
        line-height: 2;
        color:black;
    }
    
    
    
    #mainlevel a {
        display: block;
        width: 105px;
        text-decoration:none;
        color:white;
    
    }
    
    #mainlevel a:hover{
    background:url(../images/suckerfish-hover.gif) no-repeat;
    
    }
    
    
    #mainlevel li { /* all list items */
        float: left;
        width: 105px; /* width needed or else Opera goes nuts */
    list-style:none;
        text-decoration:none;
        padding-bottom:1px;
      }
    
    #mainlevel li ul { /* second-level lists */
        position: absolute;
        padding-top:2px;
        width: 105px;
        left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
    background:url(../images/ddm-bg.gif) repeat-y;
    border-top:1px solid #742F0A ;
    border-bottom:2px solid #742F0A;
    
    
    
    }
    
    #mainlevel li ul ul { /* third-and-above-level lists */
        margin: -2.2em 0 0 8.7em;
    }
    
    #mainlevel li:hover ul ul, #mainlevel li:hover ul ul ul, #mainlevel li.sfhover ul ul, #mainlevel li.sfhover ul ul ul {
        left: -999em;
        
    }
    
    #mainlevel li:hover ul, #mainlevel li li:hover ul, #mainlevel li li li:hover ul, #mainlevel li.sfhover ul, #mainlevel li li.sfhover ul, #mainlevel li li li.sfhover ul { /* lists nested under hovered list items */
        left: auto;
    }
    
    #main-level li > ul {
    top: auto;
    left: auto;
    }
    
    /* Fix IE. Hide from IE Mac \*/
    * html ul li {float: left; height: 1%;}
    * html ul li a {height: 1%;}
    /* End */

    any sugguestions would be greatly appreciated as i have deadline approaching fast!!!!

    cheers!

  8. #7
    Member
    Join Date
    Aug 2006
    Posts
    67
    Member #
    13752
    ahh! almost a success!

    i dont know why but i added the code display:block as i saw it on a another suckerfish example and it worked. i.e

    HTML Code:
    #mainlevel li:hover ul ul, #mainlevel li:hover ul ul ul, #mainlevel li.sfhover ul ul, #mainlevel li.sfhover ul ul ul {
        left: -999em;
        display: block;
    }
    however the dropdowns are mis-aligned. Any ideas why this might be?
    http://synthsoundz.com/prime_languages


    cheers!


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Search tags for this page

javascript guru needed

Click on a term to search for related topics.
All times are GMT -6. The time now is 05:27 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com