Jag har nyligen blivit ansvarig för en webbsida med en Javascript-meny för att visa undermenyer. Problemet är att undermenyerna endast expanderas på IE, inte på FF och Chrome. Eftersom jag är ansvarig måste jag fixa det, men jag har inte en aning hur.
All hjälp uppskattas väldigt.
Här är menyns kod:
menu.htm
<html>
<head>
<style type="text/css">
a
{text-decoration: none;}
a:hover {color: rgb(255,255,255);}
.title
{position: absolute;
width: 150px;
height: 20px;
left: 20px;
z-index: 10;
font-family: verdana, helvetica, sans-serif;
font-weight: bold;
font-size: 12px;}
.submenu
{position: absolute;
left: 25px;
width: 150px;
font-family: verdana, helvetica, sans-serif;
font-size: 10px;
visibility: hidden;}
.logo
{position: absolute;
top: 20px;
left: 20px;}
.flagga
{position: absolute;
top: 330px;
left: 15px;}
.prod
{position: absolute;
top: 370px;
left: 30px;
font-family: verdana, helvetica, sans-serif;
font-size: 9px;}
</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 = 5; // Number of menus
var usePictures = 0; // 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[i] = ('title' + i);
subs[i] = ('submenu' +i);
}
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;
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls[i]].top -= move;
document.layers[subs[i]].top -= move;
}
else if (document.all) {
document.all(ttls[i]).style.pixelTop -= move;
document.all(subs[i]).style.pixelTop -= move;
}
}
}
}
}
function toggle(n,move) {
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(n);
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls[i]].top -= move;
document.layers[subs[i]].top -= move;
}
else if (document.all) {
document.all(ttls[i]).style.pixelTop -= move;
document.all(subs[i]).style.pixelTop -= move;
}
}
}
else {
submenu.visibility = visible;
if (usePictures) picopen(n);
if (lastn != n) {
lasttoggle(lastn,lastmove);
}
for (var i = (n+1); i <= nom; i++) {
if (document.layers) {
document.layers[ttls[i]].top += move;
document.layers[subs[i]].top += move;
}
if (document.all) {
document.all(ttls[i]).style.pixelTop += move;
document.all(subs[i]).style.pixelTop += move;
}
}
}
lastn = n;
lastmove = move;
}
// End -->
</script>
<title>Meny</title>
</HEAD>
<body bgcolor="#000066" alink="#FFFF33" vlink="#FFCC00" bgproperties="fixed" text="white" link="#FFCC00">
<div class="logo">
<a href="faktastart.htm" target="mainFrame">
<img src="bilder/logo.gif" width="123" height="84" border="0" alt="Till förstasidan"></a>
</div>
<div class="title" id="title1" style="top: 150px"> <a href="#" onclick="javascript: toggle(1,55); return false">Historia</a>
</div>
<div class="submenu" id="submenu1" style="top: 170px"> <a href="bygghist.htm" target="mainFrame">Byggnaden</a><br>
<a href="agarlangd.htm" target="mainFrame">Ägarlängd</a><br>
<a href="histog.htm" target="mainFrame">Historiska ögonblick</a><br>
<a href="sagner.htm" target="mainFrame">Sägner</a> </div>
<div class="title" id="title2" style="top: 170px"> <a href="#333333" onclick="javascript: toggle(2,55); return false">Slottet
i nutid</a> </div>
<div class="submenu" id="submenu2" style="top: 190px"> <a href="bilder.htm" target="mainFrame">Bilder
från slottet</a><br>
<a href="film.htm" target="mainFrame">Filminspelningar</a><br>
<a href="forfatt.htm" target="mainFrame">Författare i trakten</a>
</div>
<div class="title" id="title3" style="top: 190px"> <a href="#" target="mainFrame" onclick="javascript: toggle(3,29); return false">Besök</a> </div>
<div class="submenu" id="submenu3" style="top: 210px">
<a href="kontakt.htm" target="mainFrame">Information</a><br>
<a href="kontakt.htm#karta" target="mainFrame">Vägbeskrivning</a>
</div>
<div class="title" id="title4" style="top: 210px"> <a href="#" onclick="javascript: toggle(4,55); return false">Utflyktsmål</a></div>
<div class="submenu" id="submenu4" style="top: 230px"> <a href="mat.htm" target="mainFrame">Matställen</a><br>
<a href="logi.htm" target="mainFrame">Övernattning</a><br>
<a href="bad.htm" target="mainFrame">Badplatser</a><br>
<a href="sevard.htm" target="mainFrame">Sevärdheter</a><br></div>
<div class="title" id="title5" style="top: 230px"> <a href="#" onclick="javascript: toggle(5,42); return false">Länkar</a>
</div>
<div class="submenu" id="submenu5" style="top: 250px"> <a href="ltur.htm" target="mainFrame">Turistinfo</a><br>
<a href="lslott.htm" target="mainFrame">Slott</a><br>
<a href="lankar.htm" target="mainFrame">Övriga länkar</a> </div>
<div class="flagga"><a href="eng.htm" target="mainFrame"><img src="bilder/britt.gif" width="39" height="18" border="0" alt="Information in English"></a>
<a href="ger.htm" target="mainFrame"><img src="bilder/tysk.gif" width="37" height="18" border="0" alt="Auskunft auf Deutsch"></a>
<a href="fin.htm" target="mainFrame"><img src="bilder/fin.gif" width="33" height="18" border="0"></a></div>
<p class="prod"><a href="master.htm" target="mainFrame"><i>Producerad av XXX</i></a>
</p>
</body>
</html>