Display of tree menu in Firefox very different from IE!

Having problems with DHTML Menu? There is usually somebody here who knows the answer.
Post Reply
Juree
Advanced
Advanced
Posts: 11
Joined: Sat Apr 16, 2005 4:38 am

Display of tree menu in Firefox very different from IE!

Post by Juree »

Hi all,

I'm implementing a licensed copy of Milonic tree menu on a new site and I'm having an issue with the display in Firefox (1.0.4) being radically different from the display in IE (6.0.2900)

URL: http://www.juree.com/estateworks/corpor ... wFirms.asp

The biggest difference is the amount of space that appears between a menu title and the submenu items; and the amount of space between a menu title with no submenu and a menu title with a submenu. The way it appears in IE is how I want it to look.

Here is my ...data.js file code:

Code: Select all

_scrollAmount=5      // Used for Netscape 4 scrolling
_scrollDelay=10	     // Used for Netscape 4 scrolling

_menuCloseDelay=500  // The delay for menus to remain visible on mouse off
_menuOpenDelay=150   // The delay for opening menus on mouse over
_subOffsetTop=20;     // Sub menu offset Top position
_subOffsetLeft=-170;  // Sub menu offset Left position

retainClickValue = true; 

Goverfilter="Alpha(style=1,opacity=25,finishOpacity=100,startX=0,finishX=100,startY=100,finishY=0);Fade(duration=0.2);Shadow(color='#777777', Direction=135, Strength=5)"
Goverfilter="Fade(duration=0.2);Alpha(opacity=90);Shadow(color='#777777', Direction=135, Strength=5)"
Goutfilter="randomdissolve(duration=0.3)"
Goutfilter=""
Goverfilter=""

AllMargin=0;

treeOffset=10;  // Used to set the offset of sub menus
singleMasterMenu=true // Informs the system to on;y have one menu open at a time


with(tstyle1=new mm_style()){
offcolor = "#ffffff";
onbgcolor = "#B1C0DB";
oncolor = "#ffffff";
offbgcolor="#6182B8";
ondecoration="none";
borderwidth=0;
padding = 4;
fontsize = "110%";
fontfamily="Tahoma, Verdana, Arial";
fontweight="bold";
separatorimage="http://www.juree.com/estateworks/corporateSite/images/sep.jpg";
separatorsize=2;
itemwidth=170;
}


sub1Style=new copyOf(tstyle1)
sub1Style.offcolor = "#ffffff";
sub1Style.clickcolor="#009";
sub1Style.pagecolor = "#009";
/*sub1Style.pagebgcolor ="#B1C0DB";*/
sub1Style.fontsize = "100%";
sub1Style.itemwidth=145;
sub1Style.padding=1;

tstyle1.offcolor="#ffffff";
tstyle1.clickcolor="#009";

	with(new menuname("main Tree Menu")){
	position="relative";
	style = tstyle1;
	alwaysvisible = 1;
	itemwidth=170;
	
	aI("text=Home;url=http://www.juree.com/estateworks/index.asp;");
	aI("text=Solutions;showmenu=Solutions;type=tree;");
	aI("text=Products & Services;showmenu=Products;type=tree;");
	aI("text=Customers;showmenu=Customers;type=tree;");
	aI("text=Partners;showmenu=Partners;type=tree;");
	aI("text=Resources;showmenu=Resources;type=tree;");
	aI("text=News & Events;showmenu=News;type=tree;");
	aI("text=Company;showmenu=Company;type=tree;");	
	aI("text=Contact Us;showmenu=Contact;type=tree;");		
	}


	with(new menuname("Solutions")){
	style = sub1Style;
	aI("status=Overview;text=Overview;url=http://www.juree.com/estateworks/corporateSite/solutions/overview.asp;");
	aI("status=Law Firms;text=Law Firms;url=http://www.juree.com/estateworks/corporateSite/solutions/lawfirms.asp;");
	aI("status=Financial Institutions;text=Financial Institutions;url=http://www.juree.com/estateworks/corporateSite/solutions/financial.asp;");
	aI("status=Family Offices;text=Family Offices;url=http://www.juree.com/estateworks/corporateSite/solutions/familyoffices.asp;");
	aI("status=Financial/Investment Advisers;text=Financial/Investment Advisers;url=http://www.juree.com/estateworks/corporateSite/solutions/advisors.asp;");
	}

	with(new menuname("Products")){
	style = sub1Style;
	aI("status=Overview;text=Overview;url=http://www.juree.com/estateworks/corporateSite/products/overview.asp;");
	aI("status=Estate Planning;text=Estate Planning;url=http://www.juree.com/estateworks/corporateSite/products/estateplanning.asp;");
	aI("status=Estate Settlement;text=Estate Settlement;url=http://www.juree.com/estateworks/corporateSite/products/estatesettlement.asp;");	
	aI("status=Technology;text=Technology;url=http://www.juree.com/estateworks/corporateSite/products/technology.asp;");	
	aI("status=Professional Services;text=Professional Services;url=http://www.juree.com/estateworks/corporateSite/products/services.asp;");	
	}
	
	with(new menuname("Customers")){
	style = sub1Style;
	aI("status=Overview;text=Overview;url=http://www.juree.com/estateworks/corporateSite/customers/overview.asp;");
	}
	
	with(new menuname("Partners")){
	style = sub1Style;
	aI("status=Overview;text=Overview;url=http://www.juree.com/estateworks/corporateSite/partners/overview.asp;");
	aI("status=Partners;text=Partners;url=http://www.juree.com/estateworks/corporateSite/partners/partners.asp;");
	}
	
	with(new menuname("Resources")){
	style = sub1Style;
	aI("status=Case Studies;text=Case Studies;url=http://www.juree.com/estateworks/corporateSite/resources/casestudies.asp;");
	aI("status=White Papers;text=White Papers;url=http://www.juree.com/estateworks/corporateSite/resources/whitepapers.asp;");
	aI("status=Collateral;text=Collateral;url=http://www.juree.com/estateworks/corporateSite/resources/collateral.asp;");	
	aI("status=Demo;text=Demo;url=http://www.juree.com/estateworks/corporateSite/resources/demo.asp;");
	aI("status=FAQ;text=FAQ;url=http://www.juree.com/estateworks/corporateSite/resources/FAQ.asp;");
	}

	with(new menuname("News")){
	style = sub1Style;
	aI("status=News;text=News;url=http://www.juree.com/estateworks/corporateSite/news/news.asp;");
	aI("status=Events;text=Events;url=http://www.juree.com/estateworks/corporateSite/news/events.asp;");	
	}

	with(new menuname("Company")){
	style = sub1Style;
	aI("status=Overview;text=Overview;url=http://www.juree.com/estateworks/corporateSite/company/overview.asp;");
	aI("status=Management Team;text=Management Team;url=http://www.juree.com/estateworks/corporateSite/company/mgmtteam.asp;");
	aI("status=Board of Directors;text=Board of Directors;url=http://www.juree.com/estateworks/corporateSite/company/bod.asp;");	
	aI("status=Careers;text=Careers;url=http://www.juree.com/estateworks/corporateSite/company/careers.asp;");
	aI("status=Privacy;text=Privacy;url=http://www.juree.com/estateworks/corporateSite/company/privacy.asp;");
	}

	with(new menuname("Contact")){
	style = sub1Style;
	aI("status=Contact Estate Works;text=Contact Estate Works;url=http://www.juree.com/estateworks/corporateSite/contact/contactus.asp;");
	}
On the page itself I'm calling the following:

Code: Select all

		<SCRIPT language="JavaScript">	
		drawMenus();
		openBranchByName("Solutions"); 
		mmItemActivateByNumber(10);
		</script>
Does anyone have any idea why this menu appears so differently in Firefox? Any help is greatly appreciated!!

Juree
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

Hi,

It's in your style sheet. I removed the padding-bottom:10px from the Body part and the menus looked the same in IE and FF. Some of the generic coding, in particular padding, table, td, and tr, seem to be applied to the menu by some browsers.

Ruth
Juree
Advanced
Advanced
Posts: 11
Joined: Sat Apr 16, 2005 4:38 am

Post by Juree »

Hi Ruth,

Thanks for the reply.

I removed the "padding-bottom: 10px;" from the body tag in my CSS file, but nothing changed. I've dumped my cache, closed and restarted the browser, but there is no change. I guess I'm missing something.

I double checked to see if I had this set anyplace else, but no luck there either. Any idea of what I'm missing?

Thanks again for the help...

Juree
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

Hi,

OK, I realize that what I had done was removed that padding, but I'd also blocked out the style sheet itself. Going over it again, I found that it's the #bodyContent TD that is causing the problem. I removed the id=bodyContent from the table and then did this in the td so the menu would be where it is now [more or less]

Code: Select all

<TD class=subNav rowSpan=2 valign="top"><br>
      <SCRIPT language=JavaScript>	
		drawMenus();
		openBranchByName("Solutions"); 
		mmItemActivateByNumber(10);
		</SCRIPT>
    </TD>
I'm sure since you work with css stylesheets you can figure a way to do it. I know that making something a class and then applying it in the <td class= section didn't used to affect the menu.

Hope this helps.

Ruth
User avatar
John
 Team
 Team
Posts: 5967
Joined: Sun May 19, 2002 8:23 pm
Location: Phoenix, AZ
Contact:

Post by John »

You also might want to get current on FF. It's up to 1.5.0.1 now. Needless to say, they've fixed a lot of items.
John
Juree
Advanced
Advanced
Posts: 11
Joined: Sat Apr 16, 2005 4:38 am

Post by Juree »

Hi Ruth -

Thanks so much! Actually, after I posted my last reply, I did exactly what you mentioned. I took away the style sheet and then added each element back in until I found the culprit. Now it looks great!

And John, thanks for the suggestion to upgrade - I've now done so, so I'm now all set.

Thanks again for the assistance - this forum is a terrific resource while I get experience with this menu tool. I really appreciate you taking the time to look over my stuff. My client LOVES the menu implementation and I'm sure I'll find more uses for Milonic for other clients in the future.

Juree
User avatar
Ruth
 Team
 Team
Posts: 8763
Joined: Thu May 15, 2003 5:02 am
Location: Yucaipa, CA
Contact:

Post by Ruth »

You're very welcome.

I'm sure you will find more uses. In my opinion, it's a terrific menu, the best I've seen and so much more reasonably priced than most. It's why we volunteer here :)

Ruth
Post Reply