Board Logo

FireFox Compatibility Isues
datazen - 10/22/2005 at 06:12 PM

Why does the positioning and the height of the menu differ when using FireFox Browser? All looks great in IE but in FireFox it doesn't look the same and doesn't line up the same.

Doesn't the Pro version have cross-browser compatibility? Or do I need to upgrade to the Gold version.

Any help is greatly appreciated. All I need now is to get this one problem solved.

Thank you.


spw - 1/19/2006 at 11:59 PM

Cross-browser is always an issue - Tigra does work (ie behave) the same across all browsers (I use Netscape, Firefox, IE and Opera) BUT has no influence on the definition/resolution of what is displayed. Annoying indeed!

Maybe this will help: I recently developed a site which detects browser and directs to the appropriate set of code pages - in fact there are only two main groups to worry about (at least at the monent).

Detection was based on the following:


-------------[ Copy from here]--------------------
<HTML><HEAD><TITLE>Start Page</TITLE>
<SCRIPT LANGUAGE = "JavaScript"><!--
// Based on original script by Iceman, dciceman[at]usa.net Copyright 1997 Iceman.
//This one modified to differentiate between MS IE and the rest

var r
browser = navigator.appName

version="4.0 (compatible; MSIE 4.0b1; Windows 95)"
if (browser == "Microsoft Internet Explorer" && navigator.appVersion==version) {
//If Browser is MSIE 4.0b1 then go to MSIE Page.
parent.location.href="index-ie.html"
r=2
}

else {
ua="Mozilla/2.0 (compatible; MSIE 3.02; Windows 95)"
if (navigator.userAgent==ua){
//If Browser is MSIE 3.02 go to MSIE Page.
parent.location.href="index-ie.html"
r=2
}

version="4.0 (compatible; MSIE 4.0b2; Windows 95)"
if (browser == "Microsoft Internet Explorer" && navigator.appVersion==version) {
//If Browser is MSIE 4.0b2 then go to MSIE Page.
parent.location.href="index-ie.html"
r=2
}

version="2.01 (Win95; I)"
if (navigator.appVersion==version && navigator.appCodeName=="Mozilla") {
//If Browser is Netscape 2.01 go to Netscape page.
parent.location.href="index-ns.html"
r=1
}

version="2.0 (Win95; I; 16bit)"
if (navigator.appVersion==version && navigator.appCodeName=="Mozilla") {
//If Browser is Netscape 2.0 16 bit go to Netscape page.
parent.location.href="index-ns.html"
r=1
}

version="4.01 [en] (Win95; I)"
if (navigator.appVersion==version && navigator.appCodeName=="Mozilla") {
//If Browser is Netscape 4.01 go to Netscape page.
parent.location.href="index-ns.html"
r=1
}

version="3.0 (Win95; I)"
if (browser == "Netscape" && navigator.appVersion==version) {
// If browser is Netscape 3.0 for Win95 go to Netscape Page.
parent.location.href="index-ns.html"
r=1
}
}

if (browser=="Netscape") {
// If browser is Netscape and Supports JavaScript go to Netscape Page
parent.location.href="index-ns.html"
r=1
}

if (browser=="Opera") {
// If browser is Opera and Supports JavaScript go to Opera Page
parent.location.href="index-op.html"
r=1
}

if (r !=1 && r !=2){
// if browser is not Nestcape or MSIE known versions go to IE page.
//(caters for any other JavaScript Browsers).
parent.location.href="index-ie.html"
}

// -->
</SCRIPT>
</HEAD>
<BODY BGCOLOR="000000" TEXT="FFFFFF">
Switching you to next page!<BR><BR>
(If your browser remains on this page for more than 5 seconds it is not JavaScript compatible. Please download a new browser from <A HREF="http://home.netscape.com">Netscape Communications Corp.</A> or <A HREF="http://www.microsoft.com/ie/default.asp">Microsoft Corp.</A>
</BODY>
</HTML>


LordErikS - 7/26/2006 at 09:30 AM

I would suggest creating two menu_tpl.js and adding the following lines to every HTML page you call. Then you just have to tweak the settings that you find different. I also do this with my .css for each page.

You create the base for Firefox and then the one under "if IE" for (surprisingly) IE.

<script language="JavaScript" src="scriptmenu.js"></script>
<script language="JavaScript" src="scriptmenu_items.js"></script>
<script language="JavaScript" src="scriptmenu_tpl.js"></script>
<!--[if IE]>
<script language="JavaScript" src="scriptmenu_tpl_ie.js"></script>
<![endif]-->


tigra - 7/26/2006 at 09:49 AM

We leave the web developer with freedom to use any CSS properties and HTML code with the menu. Some properties render differently in the different browsers or in different modes and we have no control over it. Just make sure to pick the settings that work the same in all browsers.

One of the most frequently asked browser compatibility related question is about absolutely positioned menu going off-sync with the rest of the content of the page. The menu actually stays at the same coordinates, it's the content of the page that moves because of the different default document margins in different browsers. The problem is solved by specifying the document margins explicitly.


Softcomplex: http://www.softcomplex.com/
Back to forum: http://www.softcomplex.com/forum/