webForumDet fria alternativet

javascript och layers

1 svar · 219 visningar · startad av esra

esraMedlem sedan okt. 2000101 inlägg
#1

Hej javascript gurus!
Jag har ett Netscape/IE problem med en meny jag gjort.
Det hela går ut på att knapparna skall behålla grön färg när man klickar på dem. Allt funkar fint men en undermeny som visas i ett layer (Layer03) krånglar i Netscape. Efter att man tryckt på denna knapp så brakar hela mitt menysystem... Jag skickar med all kod för den intresserade:

---------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>

<!--- the sticky part in the navigation... --->
<script type="text/javascript">
<!--

if (document.images) {
button_1_on=new Image;
button_1_on.src="bilder/meny/gra_roll_01-over.gif";
button_1_off=new Image;
button_1_off.src="bilder/meny/gra_roll_01.gif";

button_2_on=new Image;
button_2_on.src="bilder/meny/gra_roll_02-over.gif";
button_2_off=new Image;
button_2_off.src="bilder/meny/gra_roll_02.gif";

button_3_on=new Image;
button_3_on.src="bilder/meny/gra_roll_03-over.gif";
button_3_off=new Image;
button_3_off.src="bilder/meny/gra_roll_03.gif";

button_4_on=new Image;
button_4_on.src="bilder/meny/gra_roll_04-over.gif";
button_4_off=new Image;
button_4_off.src="bilder/meny/gra_roll_04.gif";

button_5_on=new Image;
button_5_on.src="bilder/meny/gra_roll_05-over.gif";
button_5_off=new Image;
button_5_off.src="bilder/meny/gra_roll_05.gif";

button_6_on=new Image;
button_6_on.src="bilder/meny/gra_roll_06-over.gif";
button_6_off=new Image;
button_6_off.src="bilder/meny/gra_roll_06.gif";

//sticky buttons for the subnavigation

button_7_on=new Image;
button_7_on.src="bilder/undermeny/u_meny_kont_roll_01-over.gif";
button_7_off=new Image;
button_7_off.src="bilder/undermeny/u_meny_kont_roll_01.gif";

button_8_on=new Image;
button_8_on.src="bilder/undermeny/u_meny_fs_s_s_roll_02-over.gif";
button_8_off=new Image;
button_8_off.src="bilder/undermeny/u_meny_fs_s_s_roll_02.gif";

button_9_on=new Image;
button_9_on.src="bilder/undermeny/u_meny_fs_s_s_roll_03-over.gif";
button_9_off=new Image;
button_9_off.src="bilder/undermeny/u_meny_fs_s_s_roll_03.gif";

button_10_on=new Image;
button_10_on.src="bilder/undermeny/u_meny_wp_roll_01-over.gif";
button_10_off=new Image;
button_10_off.src="bilder/undermeny/u_meny_wp_roll_01.gif";

var re;

}

function rollIn(imgName){
if (document.images) document[imgName].src=eval(imgName + "on.src");
}
function rollOut(imgName){
if (document.images && re!=imgName) document[imgName].src=eval(imgName + "off.src");
}
function selectLink(imgName){
if(re) document[re].src=eval(re + "off.src");
re = imgName;
}

//funktioner för att gömma och visa lager

function showLayer(Id){
if (document.all) {
document.all[Id].style.visibility = "visible";
} else if (document.layers){
document.layers[Id].visibility = "show";
}
}

function hideLayer(Id){
if (document.all) {
document.all[Id].style.visibility = "hidden";
} else if (document.layers){
document.layers[Id].visibility = "hide";
}
}

<!--
function MM_findObj(n, d) { //v3.0
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.document); return x;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}}
}

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a)&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
//-->
</script>

<title>Navigation for the Nayana site</title>

</head>

<body bgcolor="#666666" background="bakgrunder/bg_topp.gif" leftmargin=0 topmargin=0 onLoad="MM_preloadImages('bilder/undermeny/u_meny_kont_roll_01.gif','bilder/undermeny/u_meny_fs_s_s_roll_02-u_men.gif','bilder/undermeny/u_meny_fs_s_s_roll_03.gif','bilder/undermen y/u_meny_wp_roll_01.gif','bilder/meny/gra_roll_03-over.gif','bilder/meny/gra_roll_03.gif')">
<span id="Layer03" style="position:absolute; left:383px; top:38px; width:99px; height:25px; z-index:2; visibility:hidden">
<table border="0" cellspacing="0" cellpadding="0" align="right">
<tr>
<td>
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_1_');hideLayer('Layer03');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseover="rollIn('button_1_')" onMouseout="rollOut('button_1_')"><img src="bilder/undermeny/u_meny_wp_roll_01.gif" border="0" name="button_10_" width="86" height="17" > </a>
</td>
</tr>
</table>
</span>

<table width="780" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td height="2"></td>
</tr>
<tr>
<td height="29" width="780">
<!-- Main menu -->
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_1_');hideLayer('Layer03');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseover="rollIn('button_1_')" onMouseout="rollOut('button_1_')"><img src="bilder/meny/gra_roll_01.gif" width="179" height="29" border="0" name="button_1_"></a>
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_2_');hideLayer('Layer03');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseover="rollIn('button_2_')" onMouseout="rollOut('button_2_')"><img src="bilder/meny/gra_roll_02.gif" width="153" height="29" border="0" name="button_2_"></a>
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_3_');showLayer('Layer03');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseover="rollIn('button_3_')" onMouseout="rollOut('button_3_')"><img src="bilder/meny/gra_roll_03.gif" width="147" height="29" border="0" name="button_3_"></a>
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_4_');hideLayer('Layer03');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseover="rollIn('button_4_')" onMouseout="rollOut('button_4_')"><img src="bilder/meny/gra_roll_04.gif" width="89" height="29" border="0" name="button_4_"></a>
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_5_');hideLayer('Layer03');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseover="rollIn('button_5_')" onMouseout="rollOut('button_5_')"><img src="bilder/meny/gra_roll_05.gif" width="71" height="29" border="0" name="button_5_"></a>
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_6_');hideLayer('Layer03');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseover="rollIn('button_6_')" onMouseout="rollOut('button_6_')"><img src="bilder/meny/gra_roll_06.gif" width="141" height="29" border="0" name="button_6_"></a>
</td>
</tr>
<tr align="right" valign="top">
<td width="780">
<table border="0" cellspacing="0" cellpadding="0" align="right">
<tr>
<td height="7"></td>
<td width="170" height="7"></td>
</tr>
<tr>
<td>
<!-- sub menu -->
<a href="#" target="" onClick="selectLink('button_7_');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseOver="rollIn('button_7_')" onMouseOut="rollOut('button_7_')"><img src="bilder/undermeny/u_meny_kont_roll_01.gif" name="button_7_" width="60" height="17" border="0"></a>
<a href="#" target="" onClick="selectLink('button_8_');MM_swapImage('button_9_','','bilder/undermeny/u_meny_fs_s_s_roll_03.gif',1)" onMouseOver="rollIn('button_8_')" onMouseOut="rollOut('button_8_')"><img src="bilder/undermeny/u_meny_fs_s_s_roll_02.gif" name="button_8_" width="60" height="17" border="0"></a>
<a href="#" target="" onClick="selectLink('button_9_')" onMouseOver="rollIn('button_9_')" onMouseOut="rollOut('button_9_')"><img src="bilder/undermeny/u_meny_fs_s_s_roll_03-over.gif" name="button_9_" width="48" height="17" border="0"></a>
</td>
<td width="170"></td>
</tr>
</table>
</td>
</tr>
</table>

</body>
</html>
---------------------

Frågan är alltså: Hur får jag Layer03 att funka i Netscape??
(där fick ni nått att bita i :-) )

MVH / esra

esraMedlem sedan okt. 2000101 inlägg
#2

Eh...

blev lite fel kod i just Layer03. Här är det rätta:
--------------------------
<span id="Layer03" style="position:absolute; left:383px; top:38px; width:99px; height:25px; z-index:2; visibility:hidden">
<table border="0" cellspacing="0" cellpadding="0" align="right">
<tr>
<td>
<a href="#" target="" onfocus="blur()" onClick="selectLink('button_10_')" onMouseover="rollIn('button_10_')" onMouseout="rollOut('button_10_')"><img src="bilder/undermeny/u_meny_wp_roll_01.gif" border="0" name="button_10_" width="86" height="17" > </a>
</td>
</tr>
</table>
</span>
---------------------
Felet kvarstår alltjämt...

MVH /esra

134 ms totalt · 3 externa anrop · v20260731065814-full.3ab8d573
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
131 ms — hämta tråd, inlägg och bilagor (db)