Jump to content


Mollio Dropdown Main Menu and IE7

Started by lloyd_borrett, Nov 01 2006 11:16 AM

  • You cannot reply to this topic
36 replies to this topic

#16 -=nX=-

    Etomite Forum Newbie

  • Member
  • 23 posts

Posted 21 November 2006 - 03:53 PM

Unfortunately that did not work for me: http://www.nxplorer.net/assets/images/news...-mollio-bug.jpg

#17 lloyd_borrett

    Loves Etomite Forums!

  • Member
  • PipPipPipPip
  • 605 posts
  • Gender:Male

Posted 22 November 2006 - 12:20 PM

G'day,

I've managed to have success getting the drop down menu working on The Scuba Doctor web site with IE7, IE6 and Firefox.

This web site is the closest I have to the standard Mollio template.

This web site uses the following DOCTYPE and html statements...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

The stylesheet links and Javascript statements in the head section are now...
<link rel="stylesheet" type="text/css" 
  href="templates/mollio/css/main.css" media="screen" />
 <link rel="stylesheet" type="text/css" 
  href="templates/mollio/css/print.css" media="print" />
 <!--[if lte IE 6]>
  <link rel="stylesheet" type="text/css" 
   href="templates/mollio/css/ie6_or_less.css" />
 <![endif]-->
 <!--[if lte IE 7]>
  <script type="text/javascript" 
   src="templates/mollio/js/common.js"></script>
 <![endif]-->

My common.js file is now...
/*
son of suckerfish menu script from:
http://www.htmldog.com/articles/suckerfish/dropdowns/
 */
 
 sfHover = function() {
	if (!document.getElementsByTagName) return false;
	var sfEls = document.getElementById("nav").getElementsByTagName("li");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
			this.style.zIndex=8200; //this line added to force flyout to be above relatively positioned stuff in IE
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

Then I changed the following in main.css from...
#nav li:hover ul,
#nav li.sfhover ul{
left:0;
z-index:8009;
}
to...
#nav li:hover ul,
#nav li.sfhover ul{
left:0;
z-index:8009;
min-height:0;
}

Please note that my z-index values in main.css and common.js have been changed so that they work with my implementation of Lightbox 2 JS. Yours may need to be different.

Best Regards, Lloyd Borrett.

#18 eimerb

    Etomite Forum Newbie

  • Member
  • 1 posts

Posted 19 January 2007 - 05:17 PM

Yeah!
It works fine!
Many thanks to You!!!

:D

#19 Maker3

    Etomite Forum Newbie

  • Member
  • 4 posts

Posted 12 March 2007 - 03:16 PM

View Postlloyd_borrett, on Nov 1 2006, 12:16 PM, said:

www.scubadoctor.com.au
Which "news system" you use in this website?


Sorry fo my bad English, I'm from Polish

#20 M-a-d-m-a-n

    Etomite Forum Fan

  • Member
  • Pip
  • 58 posts

Posted 12 March 2007 - 06:36 PM

Hey man,

thanks a lot. Just took the time to find why this problem was occurring, took me five minutes to have a solution... thanks to you... :D

#21 Cris D.

    Loves Etomite Forums!

  • Developers
  • PipPipPipPip
  • 1,104 posts
  • Gender:Male

Posted 16 March 2007 - 10:33 AM

I wasn't sure if this was the fix for me, but I can recommend it. If you are using IE 7 and have problems with drop-down menus getting "stuck" I recommend using this fix. All I had to change was the js head tag and upgrade the common js file (in Etomite this is found in the template that contains these files) For most, this will be mollio, for EQ (Education Queensland, Australia) this will be Template_A.

#22 tenaj

    Etomite Forum Newbie

  • Member
  • 1 posts

Posted 20 March 2007 - 09:01 PM

View Postlloyd_borrett, on Nov 1 2006, 05:16 AM, said:

G'day,

Having used the Mollio Dropdown Main Menu on two sites, I've now realised that they don't work properly with IE7. The drop down menu will not disappear like it should.

This menu is actually an implementation of the Son of Suckerfish Dropdown menu.

I've seen and tried multiple variations of two supposed solutions to the problem, without any success as yet.

You can see the problem at www.scubadoctor.com.au and www.pragmatictraining.com.au.

I'm wondering if anyone out there has tackled this issue and come up with a solution that works.

Best Regards, Lloyd Borrett.
:unsure: I have not tried it yet but will after I read all the problems everybody else are having and the solutions. I have been reading the different forums on the topic and this is a solution of one poster. It is a known issue. This is what one Joomla poster said.

Since IE7 has come out, a lot of people have noticed that Suckerfish dropdown menus are allergic to it. The principal problem is that once they've dropped down, they refuse to scroll back up again. This affects a lot of Joomla sites using Suckerfish variations and also the Extended Menu module.

The solution is thankfully, simple. If your list menu ID is called "topmenu", you only have to add the following lines of code to your css:

#topmenu li:hover, #topmenu li.hover {
position:static;
}

Thanks to Built from Source for the original tip and to Sam from Site Coffee for Joomla implementation. I hope this is helpful because I know I will need a lot of help when I tackle it.

#23 Cris D.

    Loves Etomite Forums!

  • Developers
  • PipPipPipPip
  • 1,104 posts
  • Gender:Male

Posted 27 March 2007 - 11:04 AM

I thought Lloyd's solution was working until I jumped on a computer running IE6. The menu is now wandering all over the page! It re-sets on rollover to the correct place but it's height and width varies and is quite messy (blocks not lining up, spread out all over the place if window is resized. I will try to find the original java and page header scripts to see if the above simple fix works.

****several minutes later*** Yes it does work if you are sick of drop-down menus. It removes the drop down so you have to navigate from the secondary menu. I don't know what it looks like in IE6 yet!

Edited by Cris D., 27 March 2007 - 11:21 AM.

#24 katherholt

    Likes Etomite Forums!

  • Member
  • PipPip
  • 323 posts

Posted 27 March 2007 - 12:33 PM

View PostCris D., on Mar 27 2007, 07:04 AM, said:

I thought Lloyd's solution was working until I jumped on a computer running IE6. The menu is now wandering all over the page! It re-sets on rollover to the correct place but it's height and width varies and is quite messy (blocks not lining up, spread out all over the place if window is resized. I will try to find the original java and page header scripts to see if the above simple fix works.

****several minutes later*** Yes it does work if you are sick of drop-down menus. It removes the drop down so you have to navigate from the secondary menu. I don't know what it looks like in IE6 yet!

The below site has not had any modifications and works the same in IE7 as it did in IE6. Attached is the javascript file and the MollioMainMenu Snippet. I'm still using version 0.6.1 Final (Prelude)
on this website.

Attached File  __MollioMainMenu__.txt   4K   16 downloadsAttached File  common.js.txt   865bytes   13 downloads

http://www.trophygahunts.com/

Karen

#25 Cris D.

    Loves Etomite Forums!

  • Developers
  • PipPipPipPip
  • 1,104 posts
  • Gender:Male

Posted 29 March 2007 - 10:36 AM

View Postkatherholt, on Mar 27 2007, 10:33 PM, said:

The below site has not had any modifications and works the same in IE7 as it did in IE6.
OK I believe you! I have obviously stuffed up something. When you added the above script to you css, do you mean "add" or "replace". Do you mind posting your "topmenu" section of you css so I can see your coordinates? I think for yours to be working and mine not, I must have 1/2 of Lloyd's and 1/2 of yours. Although I'm sure that I put back the original CSS that shipped with 0.6.1. and added your script.

#26 katherholt

    Likes Etomite Forums!

  • Member
  • PipPip
  • 323 posts

Posted 29 March 2007 - 12:53 PM

View PostCris D., on Mar 29 2007, 06:36 AM, said:

OK I believe you! I have obviously stuffed up something. When you added the above script to you css, do you mean "add" or "replace". Do you mind posting your "topmenu" section of you css so I can see your coordinates? I think for yours to be working and mine not, I must have 1/2 of Lloyd's and 1/2 of yours. Although I'm sure that I put back the original CSS that shipped with 0.6.1. and added your script.
I will pm you to give you login to the manager so you can poke around and see how it works.
Karen

#27 TedD

    Etomite Forum Newbie

  • Member
  • 34 posts

Posted 10 April 2007 - 06:30 PM

View Postkatherholt, on Mar 29 2007, 02:53 PM, said:

I will pm you to give you login to the manager so you can poke around and see how it works.
Karen

Another solution..... :rolleyes:

I tried this and everything works fine (with IE 7).
The change in the javascript is also (I hope) a solution for IE 6.
Tested in IE 7/FF 2.0.0.3 and Opera 9.10

http://groups.google.com/group/Mollio/brow...a6769c758ac411b

link testsite: www.ictenzo.com/etomite/

#28 TedD

    Etomite Forum Newbie

  • Member
  • 34 posts

Posted 11 April 2007 - 06:48 AM

Solution above isn't necessairy.
Change this line in main.css Mollio template

#nav li:hover ul, #nav li.sfhover ul {left: 0;z-index:99999}

to

#nav li:hover ul, #nav li.sfhover ul {left: 0;z-index:99999;
min-height: 0;}

I've tested the change in main.css on a new installation with IE 7/Opera 9/Firefox 2
I didn't change the common.js file.
Can anyone test this solution with IE5 and IE6? link: www.ictenzo.com/etomite

Thanks

#29 emc

    Etomite Forum Newbie

  • Member
  • 1 posts

Posted 02 May 2007 - 01:51 AM

hi guys! im a new user of the Etomite CMS. Im currently configuring the site so it not up yet. Just want to ask about where can i put all the *.js and *.css items for the drop dropdown menu to work and specific codes should i put it... ty in advance for the help.. and by the way what template or theme i may say in the scuba shop.. it very cool.. :lol:

#30 Dean

    Loves Etomite Forums!

  • Admin
  • 4,746 posts
  • Gender:Male

Posted 02 May 2007 - 06:37 AM

Put the js/css wherever you want :) (Most use ./assets/)

The Scuba Site was using a variation of the Mollio Templates I believe :)

#31 vw53a

    Likes Etomite Forums!

  • Member
  • PipPip
  • 393 posts

Posted 04 May 2007 - 08:49 AM

View PostTed Donkers, on Apr 11 2007, 08:48 AM, said:

...
Can anyone test this solution with IE5 and IE6? link: www.ictenzo.com/etomite
I've checked with IE6 (and for comparison: Firefox 2.0.0.3) and it looks fine.

[edit]now at home: also IE7 and Opera 9 look fine.[/edit]
[edit2]ah, you tested those yourself too.[/edit2]

Edited by vw53a, 04 May 2007 - 05:54 PM.

#32 marokon_kauhu

    Etomite Forum Newbie

  • Member
  • 9 posts

Posted 05 November 2007 - 03:09 PM

View Postvw53a, on May 4 2007, 11:49 AM, said:

I've checked with IE6 (and for comparison: Firefox 2.0.0.3) and it looks fine.

[edit]now at home: also IE7 and Opera 9 look fine.[/edit]
[edit2]ah, you tested those yourself too.[/edit2]

If I change,

#nav li:hover ul, #nav li.sfhover ul {left: 0;z-index:99999}

to

#nav li:hover ul, #nav li.sfhover ul {left: 0;z-index:99999;
min-height: 0;}

in .css, the menu works fine in IE7 but not in IE6....

Any solutions?

#33 hazardouspunch

    Etomite Forum Newbie

  • Member
  • 5 posts

Posted 18 January 2008 - 07:13 PM

looks just fine in firefox.Not many people use ie7 so it won't be a problem ;)

#34 Ralph

    Loves Etomite Forums!

  • Admin
  • 6,506 posts
  • Gender:Male

Posted 18 January 2008 - 07:59 PM

View Posthazardouspunch, on Jan 18 2008, 02:13 PM, said:

looks just fine in firefox.Not many people use ie7 so it won't be a problem ;)


I don't know about where you're geographically located but almost 100% of my customers use IE7... The few who don't are holding out with IE6 as long as possible... Only a very sparse few are using Firefox... None use Opera...

From a developers standpoint, I'd love to be able to not worry about who uses IE, but in the real world where people come from every corner of it to view sites, I have no choice but to account for pathetic the IE browser...

#35 cathode

    Loves Etomite Forums!

  • Staff
  • 648 posts
  • Gender:Male

Posted 18 January 2008 - 08:13 PM

View PostRalph, on Jan 18 2008, 02:59 PM, said:

I don't know about where you're geographically located but almost 100% of my customers use IE7... The few who don't are holding out with IE6 as long as possible... Only a very sparse few are using Firefox... None use Opera...

From a developers standpoint, I'd love to be able to not worry about who uses IE, but in the real world where people come from every corner of it to view sites, I have no choice but to account for pathetic the IE browser...

As a rule, I steer everyone away from dropdown menus. You'll save yourself and everyone else so much headache.
Back to Completed Templates


1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users