Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
Compatibility with Firefox 1
- Thread starter ck1999
- Start date
-
1
- #2
show your code.
*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
- Thread starter
- #3
The error I am getting now is submenu is not definied
<HEAD>
<style type="text/css">
a
{text-decoration: none;}
.title
{position: absolute;
width: 100px;
height: 20px;
left: 10px;
z-index: 10;
font-family: verdana, helvetica, sans-serif;
font-weight: bold;
font-size: 12px;}
.submenu
{position: absolute;
left: 25px;
width: 120px;
border: 1px solid black;
background-color: yellow;
font-family: verdana, helvetica, sans-serif;
font-size: 10px;
visibility: hidden;}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
// ADDITIONAL NOTES
// The input variables to the toggle function are the number of the submenu to open/close,
// starting with 0, and the number of pixels to move the objects below.
// For example toggle(1,60) opens/closes the second submenu and moves the objects below 60 pixels.
var nom = 4; // Number of menus
var usePictures = 1; // use pictures? 1 = yes, 0 = no
var ttls = new Array(); // An array for the title objects
var subs = new Array(); // An array for the submenu objects
var lastn;
var lastmove;
if (document.layers) {visible = 'show';hidden = 'hide';}
else if (document.all) {visible = 'visible';hidden = 'hidden';}
for (var i = 1; i <= nom; i++) {ttls = ('title' + i);subs = ('submenu' +i);}
function picopen
{
title = ('title' + n);
pic = ('pic' + n);
if (document.layers) {document.layers[title].document.images[pic].src = "opened.gif";}
else if (document.all) {document.all(pic).src = "opened.gif";}
}
function picclose {
title = ('title' + n);
pic = ('pic' + n);
if (document.layers) {document.layers[title].document.images[pic].src = "closed.gif";}
else if (document.all) {document.all(pic).src = "closed.gif";}
}
lastn = (nom + 1);
lastmove = 0;
function lasttoggle(n,move) {
if (n <= nom) {menu = ('submenu' + n);
if (document.layers) {submenu = document.layers[menu];}
else if (document.all) {submenu = document.all(menu).style;}
if (submenu.visibility == visible) {submenu.visibility = hidden;
picclose; // Remove this if you don't use pictures
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top -= move;
document.layers[subs].top -= move;}
else if (document.all) {
document.all(ttls).style.pixelTop -= move;
document.all(subs).style.pixelTop -= move;}
}
}
}
}
function toggle(n,move) {
var i = n+1
menu = ('submenu' + n);
if (document.layers) {submenu = document.layers[menu];}
else if (document.all) {submenu = document.all(menu).style;}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
if (usePictures) picclose;
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {document.layers[ttls].top -= move;document.layers[subs].top -= move;}
else if (document.all) {document.all(ttls).style.pixelTop -= move;document.all(subs).style.pixelTop -= move;}
}
}
else {
submenu.visibility = visible;
if (usePictures) picopen;
if (lastn != n) {lasttoggle(lastn,lastmove);}
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {document.layers[ttls].top += move;document.layers[subs].top += move;}
if (document.all) {document.all(ttls).style.pixelTop += move;document.all(subs).style.pixelTop += move; }
}
}
lastn = n;
lastmove = move;
}
// End -->
</script>
<HEAD>
<style type="text/css">
a
{text-decoration: none;}
.title
{position: absolute;
width: 100px;
height: 20px;
left: 10px;
z-index: 10;
font-family: verdana, helvetica, sans-serif;
font-weight: bold;
font-size: 12px;}
.submenu
{position: absolute;
left: 25px;
width: 120px;
border: 1px solid black;
background-color: yellow;
font-family: verdana, helvetica, sans-serif;
font-size: 10px;
visibility: hidden;}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
// ADDITIONAL NOTES
// The input variables to the toggle function are the number of the submenu to open/close,
// starting with 0, and the number of pixels to move the objects below.
// For example toggle(1,60) opens/closes the second submenu and moves the objects below 60 pixels.
var nom = 4; // Number of menus
var usePictures = 1; // use pictures? 1 = yes, 0 = no
var ttls = new Array(); // An array for the title objects
var subs = new Array(); // An array for the submenu objects
var lastn;
var lastmove;
if (document.layers) {visible = 'show';hidden = 'hide';}
else if (document.all) {visible = 'visible';hidden = 'hidden';}
for (var i = 1; i <= nom; i++) {ttls = ('title' + i);subs = ('submenu' +i);}
function picopen
{title = ('title' + n);
pic = ('pic' + n);
if (document.layers) {document.layers[title].document.images[pic].src = "opened.gif";}
else if (document.all) {document.all(pic).src = "opened.gif";}
}
function picclose
{title = ('title' + n);
pic = ('pic' + n);
if (document.layers) {document.layers[title].document.images[pic].src = "closed.gif";}
else if (document.all) {document.all(pic).src = "closed.gif";}
}
lastn = (nom + 1);
lastmove = 0;
function lasttoggle(n,move) {
if (n <= nom) {menu = ('submenu' + n);
if (document.layers) {submenu = document.layers[menu];}
else if (document.all) {submenu = document.all(menu).style;}
if (submenu.visibility == visible) {submenu.visibility = hidden;
picclose
; // Remove this if you don't use picturesfor (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls].top -= move;
document.layers[subs].top -= move;}
else if (document.all) {
document.all(ttls).style.pixelTop -= move;
document.all(subs).style.pixelTop -= move;}
}
}
}
}
function toggle(n,move) {
var i = n+1
menu = ('submenu' + n);
if (document.layers) {submenu = document.layers[menu];}
else if (document.all) {submenu = document.all(menu).style;}
if (submenu.visibility == visible) {
submenu.visibility = hidden;
if (usePictures) picclose
;for (var i = (n+1); i <= nom; i++) {
if (document.layers) {document.layers[ttls].top -= move;document.layers[subs].top -= move;}
else if (document.all) {document.all(ttls).style.pixelTop -= move;document.all(subs).style.pixelTop -= move;}
}
}
else {
submenu.visibility = visible;
if (usePictures) picopen
;if (lastn != n) {lasttoggle(lastn,lastmove);}
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {document.layers[ttls].top += move;document.layers[subs].top += move;}
if (document.all) {document.all(ttls).style.pixelTop += move;document.all(subs).style.pixelTop += move; }
}
}
lastn = n;
lastmove = move;
}
// End -->
</script>
you're using an antiquated method of traversing the DOM - document.layers and document.all are only functional with netscape and internet explorer, respectively.
you should read up on the document.getElementById() method and go from there.
*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
you should read up on the document.getElementById() method and go from there.
*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
- Thread starter
- #5
it will work in all modern browsers that support JavaScript.
*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
*cLFlaVA
----------------------------
[tt]"quote goes here"[/tt]
[URL unfurl="true"]http://www.coryarthus.com/[/url]
- Thread starter
- #7
- Status