Netscape Compatibility

[MCP]

For some reason these functions do not seem to be compabitle with Netscape. Any help with making them compatible would be greatly appreciated.
function big(lyr) {
document.all[lyr].style.height='120px';
document.all[lyr].style.width='200px';
}
/* small() makes selected layer shorter (height property)*/
function small(lyr) {
document.all[lyr].style.height='16px';
document.all[lyr].style.width='50px';
}
/* start() makes all layers short to start with (height property)*/
function extramenu() {
document.all.extra.style.height='16px';
document.all.extra.style.width='50px';
}
Thanks!

[fredmv]

If you're wondering why they aren't working, it's because you're using a proprietary IE feature: the document.all collection. You would be much better off using the standardized document.getElementById method like this:function big(lyr) {
document.getElementById(lyr).style.height='120px';
document.getElementById(lyr).style.width='200px';
}
/* small() makes selected layer shorter (height property)*/
function small(lyr) {
document.getElementById(lyr).style.height='16px';
document.getElementById(lyr).style.width='50px';
}
/* start() makes all layers short to start with (height property)*/
function extramenu() {
document.getElementById('extra').style.height='16px';
document.getElementById('extra').style.width='50px';
}

[MCP]

Thanks, but it still doesn't seem to be calling the functions in Netscape. Could it be a problem with event handlers I'm using?
if(preg_match("/MSIE/",$_SERVER["HTTP_USER_AGENT"])) // check IE is being used
print("<div id=\"extra\" style=\"position:absolute; visibility: show; left: 50; top: 90px; z-index:2;
width:50px; height:15px; overflow: hidden\" onMouseOver=\"javascript:big('extra')\";
onMouseOut=\"javascript:small('extra')\">\n"); // starts extra menu
else
print("<div id=\"extra\" style=\"position:fixed; visibility: show; left: 50; top: 90px; z-index:2;
width:50px; height:15px; overflow: hidden\" onMouseOver=\"javascript:big('extra')\";
onMouseOut=\"javascript:small('extra')\">\n"); // starts extra menu

[fredmv]

Oops. I was assuming you were referring to more recent versions of Netscape and Mozilla; are you referring to Netscape 4.x? If so, use document.layers as opposed to document.all. For it to work in both, you could simply write a function to check for the supported feature and access the node accordingly.

[MCP]

I am referring to more recent versions of Netscape. (I'm testing my site with Netscape 7.02.) I'm trying to code a collapsing menu, but in Netscape, the features activated by onMouseOver() and onMouseOut() are not working.

[fredmv]

Interesting, I know for a fact the method I provded you with does work, but my guess would be that it isn't working because you're using the JavaScript pseudo-protocol in your event handlers, try removing the javascript: before your function calls in your event handlers and see if it works correctly then. The JavaScript pseudo-protocol is only commonly needed inside the href attribute usually when you want to create a bookmarklet, otherwise event handlers should be used, and when used only require JavaScript code.

[MCP]

I took out the "javascript:" psuedo-prodocol like you suggested, and I found what I think were some errors with the syntax, which I corrected, but Netscape still doesn't seem to be activating the functions to expand the division. Here is the updated <div> code:
if(preg_match("/MSIE/",$_SERVER["HTTP_USER_AGENT"])) // check IE is being used
print("<div id=\"extra\" style=\"position:absolute; visibility: show; left: 50;
top: 90px; z-index:2; width:50px; height:15px; overflow: hidden;\"
onMouseOver=\"big('extra');\" onMouseOut=\"small('extra');\">\n"); // starts extra menu
else
print("<div id=\"extra\" style=\"position:fixed; visibility: show; left: 50;
top: 90px; z-index:2; width:50px;
height:15px; overflow: hidden;\"
onMouseOver=\"big('extra');\" onMouseOut=\"small('extra');\">\n"); // starts extra menu

[fredmv]

Could you please provide some example (generated) code?

[MCP]

This is the <div> tag that is generated when Netscape is used to view the page.
<div id="extra" style="position:fixed; visibility: show; left: 50; top: 90px;
z-index:2; width:50px; height:15px; overflow: hidden;" onMouseOver="big('extra');"
onMouseOut="small('extra');">

(I'm still using the set of JS functions you gave me that use GetElementById.)

[fredmv]

It works just fine for me (tested under Mozilla 1.6a, IE6, and even Opera 7.23). Make sure you are using the code exactly as I provided. Even changing the case of a certain letter could prevent it from working since JavaScript is case-sensitive.

[MCP]

I'm trying to get this to work on the same page with another scrolling menu. I've posted the code I'm using for that scrolling menu here (http://forums.webdeveloper.com/showthread.php?s=&threadid=24236).
Is there a conflict with using two of these on the same page?

[fredmv]

Originally posted by MCP
Is there a conflict with using two of these on the same page? Possibly. Check over each script to be sure there are no variables or functions with the same name (and other things like that).

[MCP]

These two JS functions are in the same .js file, and they are both loaded at the same time from the <body> tag using onLoad() event handler. Could there be a conflict from having the same variable names in the two different functions?
function checkLocation() {
object="chimenu";
yy=eval(y) + 120;
eval(dS+object+sD+v+yy);
setTimeout("checkLocation()",10);
}
function extraLocation() {
object="extra";
yy=eval(y) + 90;
eval(dS+object+sD+v+yy);
setTimeout("checkLocation()",10);
}

[fredmv]

Originally posted by MCP
Could there be a conflict from having the same variable names in the two different functions?Possible but highly unlikely. The scope should only remain within the function unless you first defined it as a global variable then changed it within the functions. You could probably just pass arguments to your functions to emulate the effect you currently have. It could also have something to do with how you're calling the functions in the onload event handler, so that may be helpful to see as well.

[MCP]

Well, blow me down! All I did was change this
print("<body OnLoad=\"setVariables();checkLocation();extramenu();extraLocation();\">\n"); // start bodytoprint("<body OnLoad=\"setVariables();checkLocation();extraLocation();extramenu();\">\n"); // start body
and it decided to start working! :D

[fredmv]

Good to see you got it working. I suppose that was the problem — the variables in each function were conflicting with each other. While this may seem like a good temporary solution, you may want to consider using different variable names or passing arguments in order to prevent possible problems in the future. ;)

[MCP]

Thanks for your help! I'll probably do that. If you don't mind, I could really use your help (same code, different functionality) getting part of the code to work with IE. I've made a post about the problem here (http://forums.webdeveloper.com/showthread.php?s=&threadid=24306).

[fredmv]

You're quite welcome. Good to see that you considered my previous suggestion, hopefully you won't encounter anymore errors in the future due to variables conflicting, but as I previously said, passing arguments to the function (the best way) or using different variable names (a worse way) should completely elimante ths possibility of that happening again. As for your other question, I've replied. ;)