We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 10226
    • 412 Posts
    Hi all, I was wondering if anyone can help me figure out why my menu does not work in IE6. It works just fine in FF and IE7... I have not tested older versions of IE.

    http://sweetskies.fruitwerks.us

    Thanks!
      • 20289
      • 958 Posts
      Hover don’t work in IE6 exept for anchors!, you can use pure css (styled) drop down menus instead of javascript one, and getting over the issues like this is really time consuming!...
        [img]http://i10.tinypic.com/52c4eir.gif[/img][/td]
        [td][Wiki] [Persian support forum]
        [SVN] [RTL SVN Branch] [bugs] [FishEye+Crucible] [Learn MODx!] | [My Google Code]
        [font=tahoma][برای دسترسی به راهنمای فارسی به [url=http://www.modxcms.ir]
        • 10226
        • 412 Posts
        Good to know! But I thought my menu was pure CSS. This is actually the only code on my site I did not write myself...

        here is the nav section from my css file;
        #nav, #nav ul {padding: 0;margin: 0 auto;list-style: none}
        	#nav {align: center; width: 760px; background: #999 url("images/button_dn.gif") repeat-x;font-weight:bold;height:2.09em;font: bold 96% arial;margin: 0 0px 0 0px}
        	#nav li {position:relative;background: #999 url("images/button_dn.gif") repeat-x;float: left;width: auto;display:block;margin: 0;border-bottom: 1px solid #DDDDDD;border-right: 1px solid #DDDDDD;padding:0}
        	#nav a, #nav a:link, #nav a:visited, #nav a:hover, #nav a:active {border-bottom: none;text-decoration:none;cursor:pointer;color:#999;display: block;padding: 4px 10px 2px}
        	#nav a:hover {background: #999 url("images/button_up.gif") repeat-x;color:#81A021}
        	
        	#nav li ul {border-bottom: 1px solid #999;border-left: 1px solid #999;border-right: 1px solid #999;background: #f6f6f6;
        	filter:alpha(opacity=80);
        	-moz-opacity:0.8;
        	opacity:0.8;
        	-khtml-opacity:0.8;
        	width:11em;font-size:90%;margin-top:3px;position: absolute;font-weight:normal;left: -999em;}
        	
        	#nav li:hover ul, #nav li.sfhover ul {top:19px;left: 0;z-index:99999}
        	#nav li li {background:none;float:none;border:none;border: 1px solid #999;border-top:1px solid #fff;border-right:none;border-left:none;padding-left:0}
        	#nav li li.last {border-bottom:none}
        	#nav li li a, #nav li li a:link, #nav li li a:visited, #nav li li a:hover {
        	color:#000;
        	border-bottom: none;
        	 padding: 3px 10px 2px;
        	 }
        	#nav li li a:hover {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x;}
        	
        	#nav li.active {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x}
        	#nav li.active ul {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x}
        	#nav li.active a:link, #nav li.active a:visited, #nav li.active a:hover, #nav li.active a:active {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x}
        	#nav li.active a:hover {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x}
        	#nav li.here {color:#81A021;background:#F3F9E1 url("images/bgcloser.jpg") repeat-x; height:18px; border-bottom: none;
        	 padding: 4px 10px 2px;
        	 width:auto}
        	 #nav li.here a{color:#81A021;background:transparent; border-bottom: none; margin:0;
        	  padding:0px;}
        	#nav li li.here {color:#000;
        	background: #D2DEB0;
        	
        	 
        	 }
        	
        	#nav li.active li {border:none;border-top: 1px solid #EFEFEF}
        	#nav li.active li.last {border-bottom: none;}
        	#nav li.active li a:link, #nav li.active li a:visited, #nav li.active li a:hover, #nav li.active li a:active {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x}
        	#nav li.active li a:hover {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x}
        	
        	#nav li.active li.active a:link, #nav li.active li.active a:visited, #nav li.active li.active a:hover, #nav li.active li.active a:active {color:#000;background:#EFEFEF url("images/button_up.gif") repeat-x}
        
        	/* hide from IE mac */
        	#nav li {width:auto}
        	/* end hack */


        I have migrated over to mootools so I will probably go with a new menu eventually...
          • 20289
          • 958 Posts
          As i can see this is not a cross browser stable menu style, and there should be a conditional statements to get it to work in all browsers, better to switch to another one, there is a bunch of nice crafted dropdown menus over the net smiley
            [img]http://i10.tinypic.com/52c4eir.gif[/img][/td]
            [td][Wiki] [Persian support forum]
            [SVN] [RTL SVN Branch] [bugs] [FishEye+Crucible] [Learn MODx!] | [My Google Code]
            [font=tahoma][برای دسترسی به راهنمای فارسی به [url=http://www.modxcms.ir]
            • 10226
            • 412 Posts
            Yeah I started searching for pure CSS menus since I read your reply. Found a few I like, but I can’t imagine how to mod-x-ify them.

            .. someday smiley

            Thanks
              • 10226
              • 412 Posts
              My wife (it’s her site) is just in love with this menu. I showed her about 30 others and she hated them.

              How hard would it be to make this work on IE 6? What needs to be done?

              Thanks!
                • 20289
                • 958 Posts
                You have to ommit the hover effect if you wanto get it with IE6 or there you may place some css tweaks in the css for IE6(hack or trick!) maybe the following links gives you some idea... smiley

                EDIT: forgot to tell you this that MODx doesn’t interfer b/w the design and content!. its all about templating, after all you just have to place the css codes in your template’s .css file and changing the id or the style for the specific style... and enjoying the design you have done smiley
                  [img]http://i10.tinypic.com/52c4eir.gif[/img][/td]
                  [td][Wiki] [Persian support forum]
                  [SVN] [RTL SVN Branch] [bugs] [FishEye+Crucible] [Learn MODx!] | [My Google Code]
                  [font=tahoma][برای دسترسی به راهنمای فارسی به [url=http://www.modxcms.ir]
                  • 10226
                  • 412 Posts
                  The menus I have found that I like do not use the standard list format, they all have different identifiers for each level past the first. And all the others are single level menus. I could go with them and have another single level menu in a left column but I don’t know how to do that smiley
                    • 20289
                    • 958 Posts
                    This(menu/Wayfinder) might get you started. smiley
                      [img]http://i10.tinypic.com/52c4eir.gif[/img][/td]
                      [td][Wiki] [Persian support forum]
                      [SVN] [RTL SVN Branch] [bugs] [FishEye+Crucible] [Learn MODx!] | [My Google Code]
                      [font=tahoma][برای دسترسی به راهنمای فارسی به [url=http://www.modxcms.ir]
                      • 10226
                      • 412 Posts
                      Thanks. I have seen that before. My site is a single column layout. I have settled on a single level menu with no frills. I will have to modify 2 or three pages to make all content accessible. Now I just need to find a nice way to tell my wife the colors she picked are .. well .. pretty sure the link is earlier in this thread.

                      :)