Layers issue in Netscape 4.x - tabs question

[Jeannie]

Can anyone help me adjust this code so that it works in Netscape 4.x?

I have am developing a website for a restaurant and the menu page has
menus for lunch and dinner. Two images work as tabs, so that when you
click on the lunch menu, only that menu is visible, and likewise, when
you click on the dinner tab, only the dinner menu is visible.

This code works like a charm on IE 5.5, but I don't know how to get a
workable solution on Netscape. I suspect it's not so hard, but I need
a little help.

Thanks!!

******************************************
<script language="javascript" type="text/javascript">
var tabVisible = "tab1"

function showTab(newTab) {
newButton="b"+newTab;
oldButton="b"+tabVisible.substr(3);
show(oldButton,oldButton+".gif");
show(newButton,newButton+"_over.gif");
newTab="tab"+newTab;
document.getElementById(tabVisible).style.visibility = "hidden";
document.getElementById(newTab).style.visibility = "visible";
tabVisible = newTab;
}

function newImage(arg) {if (document.images) {rslt = new Image();
rslt.src = arg; return rslt;}}

var preloadFlag = false;

function preloadImages() {if (document.images) {
b1sel = newImage("images/bt_menu_din.gif");
b2sel = newImage("images/bt_menu_lun.gif");

b1off = newImage("images/b1.gif");
preloadFlag = true;}}

function show(name,src)
{if (document.images && (preloadFlag == true))
document.images[name].src = "images/" + src;}

</script>

 

[Lee]

Jeannie said:

Can anyone help me adjust this code so that it works in Netscape 4.x?

I have am developing a website for a restaurant and the menu page has
menus for lunch and dinner. Two images work as tabs, so that when you
click on the lunch menu, only that menu is visible, and likewise, when
you click on the dinner tab, only the dinner menu is visible.

This code works like a charm on IE 5.5, but I don't know how to get a
workable solution on Netscape. I suspect it's not so hard, but I need
a little help.

Thanks!!

******************************************
<script language="javascript" type="text/javascript">
var tabVisible = "tab1"

function showTab(newTab) {
newButton="b"+newTab;
oldButton="b"+tabVisible.substr(3);
show(oldButton,oldButton+".gif");
show(newButton,newButton+"_over.gif");
newTab="tab"+newTab;
document.getElementById(tabVisible).style.visibility = "hidden";
document.getElementById(newTab).style.visibility = "visible";
tabVisible = newTab;
}

function newImage(arg) {if (document.images) {rslt = new Image();
rslt.src = arg; return rslt;}}

var preloadFlag = false;

function preloadImages() {if (document.images) {
b1sel = newImage("images/bt_menu_din.gif");
b2sel = newImage("images/bt_menu_lun.gif");

b1off = newImage("images/b1.gif");
preloadFlag = true;}}

function show(name,src)
{if (document.images && (preloadFlag == true))
document.images[name].src = "images/" + src;}

</script>

The change to your Javascript code is to rewrite showTab()
as below. However, it still may not work, depending on
whether or not Netscape 4 sees not your page elements as
Layers.


function showTab(newTab) {
newButton="b"+newTab;
oldButton="b"+tabVisible.substr(3);
show(oldButton,oldButton+".gif");
show(newButton,newButton+"_over.gif");
newTab="tab"+newTab;
if(document.getElementById){
document.getElementById(tabVisible).style.visibility = "hidden";
document.getElementById(newTab).style.visibility = "visible";
}else if(document.layers){
document.layers[tabVisible].visibility = "hidden";
document.layers[newTab].visibility = "visible";
}
tabVisible = newTab;
}

 

[Jeannie]

Thanks - I gave it a shot, but the menu tabs end up on the top of the
page, but the description of the menu items aren't visible. Not sure
what the fix would be, but thanks for your input!

Jeannie said:

Can anyone help me adjust this code so that it works in Netscape 4.x?

I have am developing a website for a restaurant and the menu page has
menus for lunch and dinner. Two images work as tabs, so that when you
click on the lunch menu, only that menu is visible, and likewise, when
you click on the dinner tab, only the dinner menu is visible.

This code works like a charm on IE 5.5, but I don't know how to get a
workable solution on Netscape. I suspect it's not so hard, but I need
a little help.

Thanks!!

******************************************
<script language="javascript" type="text/javascript">
var tabVisible = "tab1"

function showTab(newTab) {
newButton="b"+newTab;
oldButton="b"+tabVisible.substr(3);
show(oldButton,oldButton+".gif");
show(newButton,newButton+"_over.gif");
newTab="tab"+newTab;
document.getElementById(tabVisible).style.visibility = "hidden";
document.getElementById(newTab).style.visibility = "visible";
tabVisible = newTab;
}

function newImage(arg) {if (document.images) {rslt = new Image();
rslt.src = arg; return rslt;}}

var preloadFlag = false;

function preloadImages() {if (document.images) {
b1sel = newImage("images/bt_menu_din.gif");
b2sel = newImage("images/bt_menu_lun.gif");

b1off = newImage("images/b1.gif");
preloadFlag = true;}}

function show(name,src)
{if (document.images && (preloadFlag == true))
document.images[name].src = "images/" + src;}

</script>

The change to your Javascript code is to rewrite showTab()
as below. However, it still may not work, depending on
whether or not Netscape 4 sees not your page elements as
Layers.


function showTab(newTab) {
newButton="b"+newTab;
oldButton="b"+tabVisible.substr(3);
show(oldButton,oldButton+".gif");
show(newButton,newButton+"_over.gif");
newTab="tab"+newTab;
if(document.getElementById){
document.getElementById(tabVisible).style.visibility = "hidden";
document.getElementById(newTab).style.visibility = "visible";
}else if(document.layers){
document.layers[tabVisible].visibility = "hidden";
document.layers[newTab].visibility = "visible";
}
tabVisible = newTab;
}

 

[Jeannie]

I am still in need of a solution, so if anyone knows how to make this
tabbed script work for IE4+, NS4+, NS6+, please drop me a line.
Thanks!!

Thanks - I gave it a shot, but the menu tabs end up on the top of the
page, but the description of the menu items aren't visible. Not sure
what the fix would be, but thanks for your input!

Jeannie said:

Can anyone help me adjust this code so that it works in Netscape 4.x?

I have am developing a website for a restaurant and the menu page has
menus for lunch and dinner. Two images work as tabs, so that when you
click on the lunch menu, only that menu is visible, and likewise, when
you click on the dinner tab, only the dinner menu is visible.

This code works like a charm on IE 5.5, but I don't know how to get a
workable solution on Netscape. I suspect it's not so hard, but I need
a little help.

Thanks!!

******************************************
<script language="javascript" type="text/javascript">
var tabVisible = "tab1"

function showTab(newTab) {
newButton="b"+newTab;
oldButton="b"+tabVisible.substr(3);
show(oldButton,oldButton+".gif");
show(newButton,newButton+"_over.gif");
newTab="tab"+newTab;
document.getElementById(tabVisible).style.visibility = "hidden";
document.getElementById(newTab).style.visibility = "visible";
tabVisible = newTab;
}

function newImage(arg) {if (document.images) {rslt = new Image();
rslt.src = arg; return rslt;}}

var preloadFlag = false;

function preloadImages() {if (document.images) {
b1sel = newImage("images/bt_menu_din.gif");
b2sel = newImage("images/bt_menu_lun.gif");

b1off = newImage("images/b1.gif");
preloadFlag = true;}}

function show(name,src)
{if (document.images && (preloadFlag == true))
document.images[name].src = "images/" + src;}

</script>

The change to your Javascript code is to rewrite showTab()
as below. However, it still may not work, depending on
whether or not Netscape 4 sees not your page elements as
Layers.


function showTab(newTab) {
newButton="b"+newTab;
oldButton="b"+tabVisible.substr(3);
show(oldButton,oldButton+".gif");
show(newButton,newButton+"_over.gif");
newTab="tab"+newTab;
if(document.getElementById){
document.getElementById(tabVisible).style.visibility = "hidden";
document.getElementById(newTab).style.visibility = "visible";
}else if(document.layers){
document.layers[tabVisible].visibility = "hidden";
document.layers[newTab].visibility = "visible";
} tabVisible = newTab;
}