nicht angemeldet
Hi Alex
Ich hab mal versucht eine Loesung fuer dein Problem zu finden. Das klappt allerdings nur mit den 4er Browsern (eigentlich duerfte bei den anderen gar nichts passieren!)
Was habe ich gemacht:
Zwei absolut positionierte div's definiert, die uebereinander liegen.
Im ersten div stehen in einer Tabelle die Beschriftungen fuer deine Buttons (inhaltlich habe ich natuerlich nur Muell eingetragen :-)) Die Beschriftungen fungieren hierbei als die Links inklusive zweiframes Wechsel und onmouseout/over Effekten.
Im zweiten div, dass im Hintergrund steht, sind die Grafiken in einer voellig identischen Tabelle untergebracht. Wenn man nun mit der Maus ueber die Beschriftungen faehrt, wird die jeweils darunter liegende Grafik ausgetauscht. Ein paar Kleinigkeiten hab ich im Quelltext geaendert, aber das wirst du sicher selber sehen.
So jetzt zum Quelltext:
<html>
<head><script language="javascript">
<!--
{
name1a = new Image(); name1a.src = "bild1a.gif";
name1b = new Image(); name1b.src = "bild1b.gif";
var index = 99;
var iname;
}
function lighten (bildobjekt,bildnr)
{
if (document.layers){
document.layers[0].document.images[bildnr].src=eval(bildobjekt+".src");
}
if (document.all){
document.images[bildnr].src=eval(bildobjekt+".src");
}
}
function darken (bildobjekt,bildnr)
{
if (document.layers){
document.layers[0].document.images[bildnr].src=eval(bildobjekt+".src");
}
if (document.all){
document.images[bildnr].src=eval(bildobjekt+".src");
}
}
function zweiframes (URL1,F1,URL2,F2)
{
parent.frames[F1].location.href=URL1;
parent.frames[F2].location.href=URL2;
}
// -->
</script>
<base target="_self">
<title>Navigation Home</title>
<meta name="Microsoft Theme" content="none">
<meta name="Microsoft Border" content="none">
<style type="text/css">
<!--
a {
color: #000099;
font-weight: bold;
text-decoration:none;
text-align:center;
}
-->
</style>
</head>
<body background="../images/stahlmosaik.jpg" bgproperties="fixed" topmargin="0"
leftmargin="7" link="#0000CC" vlink="#000099" alink="#0000FF">
<div id="hintergrund" style="position:absolute; top:8; left:10; z-index:1;">
<table border="0" width="120" height="160" cellspacing="2" cellpadding="0">
<tr><td width="120" height="32"><img name="bild1" src="bild1a.gif" width=120 height=32></td></tr>
<tr><td width="120" height="32"><img name="bild2" src="bild1a.gif" width=120 height=32></td></tr>
<tr><td width="120" height="32"><img name="bild3" src="bild1a.gif" width=120 height=32></td></tr>
<tr><td width="120" height="32"><img name="bild4" src="bild1a.gif" width=120 height=32></td></tr>
<tr><td width="120" height="32"><img name="bild5" src="bild1a.gif" width=120 height=32></td></tr>
</table>
</div>
<div id="text" style="position:absolute; top:8; left:10; z-index:2;">
<table border="0" width="120" height="160" cellspacing="2" cellpadding="0">
<tr>
<td width="120" height="32" nowrap><a href="javascript:zweiframes('../Allgemein/nav_home.htm','Inhalt','../home.htm','Hauptframe')" onmouseover="lighten('name1b',0);return true;" onmouseout="darken ('name1a',0); return true;">Homepage</a></td>
</tr>
<tr>
<td width="120" height="32" nowrap><a href="javascript:zweiframes('../Allgemein/nav_home.htm','Inhalt','../home.htm','Hauptframe')" onmouseover="lighten('name1b',1);return true;" onmouseout="darken ('name1a',1); return true;">Infos</a></td>
</tr>
<tr>
<td width="120" height="32" nowrap><a href="javascript:zweiframes('../Allgemein/nav_home.htm','Inhalt','../home.htm','Hauptframe')" onmouseover="lighten('name1b',2);return true;" onmouseout="darken ('name1a',2); return true;">Neuigkeiten</a></td>
</tr>
<tr>
<td width="120" height="32" nowrap><a href="javascript:zweiframes('../Allgemein/nav_home.htm','Inhalt','../home.htm','Hauptframe')" onmouseover="lighten('name1b',3);return true;" onmouseout="darken ('name1a',3); return true;">Fun-Fun-Fun</a></td>
</tr>
<tr>
<td width="120" height="32" nowrap><a href="javascript:zweiframes('../Allgemein/nav_home.htm','Inhalt','../home.htm','Hauptframe')" onmouseover="lighten('name1b',4);return true;" onmouseout="darken ('name1a',4); return true;">Wasweissich</a></td>
</tr>
</table> </div>
</body>
</html>
Für jede Hilfe bin ich tankbar :)
Oh Pitte Pitte!!
Viel Spass damit
Holger