nicht angemeldet
Ich weiß einfach nicht mehr weiter und hoffe nun auf Eure siegesreiche Hilfe.
Ich bin noch Anfängerin was JavaScript angeht und habe folgendes Script mit ein paar Freunden zusammengebastelt.
Folgendes Problem:
Ich möchte kleine Fotos versetzt übereinanderlegen (ähnlich wie eine Collage). Beim Rollover auf ein kleines Foto soll sich dieses austauschen durch ein großes, das sich über alle anderen kleinen legt und vorher nicht sichtbar war.
Gleichzeitig (wenn das große Foto sich über alle anderen legt) soll ein Text erscheinen - immer an derselben Stelle.
Funkioniert im Internet-Explorer toll und in Netscape gibt es schon Probleme bei dem Bildwechsel.
Hoffentlich kann mir jemand von Euch hilfreich zur Seite stehen!?
Hier das Script:
<html>
<head>
<title>Seite 1</title>
<LINK HREF="../E_css/style.css" REL="STYLESHEET" TYPE="text/css">
<link href="../e_css/stylepos.css" rel="STYLESHEET" type="text/css">
<script language="javascript">
<!--
if (document.images){
grafik1 = new Image(); grafik1.src = "Schmuck/O_0056.jpg";
grafik2 = new Image(); grafik2.src = "Schmuck/O_0099.jpg";
}
function bildwechsel (Bild,Dateiname,x)
{
if(document.all){
window.document.images[Bild].src=Dateiname;
}else{
document.layers["lage"+x].document.images[Bild].src=Dateiname;}
}
var z=10;
function nachVorn(y){
if(document.all){
document.all[y].style.zIndex=z;
}else{
document.layers[y].zIndex=z;}
}
var a=0;
function gifZuruck(b){
if(document.all){
document.all[b].style.zIndex=a;
}else{
document.layers[b].zIndex=a;}
}
var Schmucktext = new Array ("","<font face='arial','Futura','Helvetica' size='-2' color='000099'><br>Hier steht der erste Text</font>","<font face='arial','Futura','Helvetica' size='-2' color='000099'>Hier steht der zweite Text</font>","<font face='arial','Futura','Helvetica' size='-2' color='000099'><BR><br>Hier steht der dritte Text</font>");
function textwechsel(welcher){
if(document.all){
document.all["text"].innerHTML=Schmucktext[welcher];
}else{
document.layers["textlayer"].document.write("<div id='text' style='position:absolute; left:20px; top:350px;'>" + Schmucktext[welcher] + "</div>");
}
}
//-->
</script>
</head>
<body BACKGROUND="../H_Kacheln/Kachel.jpg" MARGINWIDTH="0" MARGINHEIGHT="0" TOPMARGIN="0" LEFTMARGIN="0" link="#0000cc" alink="#3333cc" vlink="#cc3300">
<!-- das erste Gif als Hintergrund-->
<img src="../ganzr.gif" width=616 height=440 border=0 style="left: auto; top: auto; position: absolute;" alt="">
<!-- neue Positionierung (beim Rollover) mit Blind.gif-Container-->
<div class="Spositionid1" id="lage9"><a href="#" onmouseout="bildwechsel('Bild8','Intim/blind.gif','9');gifZuruck('lage9');textwechsel(0);"><img src="Intim/blind.gif" border=0 name="Bild8" alt="Kette"></a>
</div>
<div class="Spositionid2" id="lage10"><a href="#" onmouseout="bildwechsel('Bild9','Intim/blind.gif','10');gifZuruck('lage10');textwechsel(0);"><img src="Intim/blind.gif" border=0 name="Bild9" alt="Ring"></a>
</div>
<!-- Bildwechsel (beim Rollover)-->
<div class="Sposition2" id="lage1"><a href="#" onmouseover="bildwechsel('Bild8','Schmuck/O\_0098.jpg','9');nachVorn('lage9');textwechsel(1);" onmouseout="bildwechsel('Bild0','Schmuck/O\_0098k.jpg','1')"><img src="Schmuck/O\_0098k.jpg" border=0 name="Bild0" alt="Herz-Kette"></a>
</div>
<div class="Sposition1" id="lage2"><a href="#" onmouseover="bildwechsel('Bild9','Schmuck/O\_0104.jpg','10');nachVorn('lage10');textwechsel(2);" onmouseout="bildwechsel('Bild1','Schmuck/O\_0104k.jpg','2')"><img src="Schmuck/O\_0104k.jpg" border=0 name="Bild1" alt="Zwei-Finger-Ring"></a>
</div>
<!-- Vor- und Zurück-Button-->
<div class="nextbackbutton"><a href="Schmu\_5a.htm" target="Inhalt">go back</a> <a href="Schmu\_6b.htm" target="Inhalt">go next</a></div>
<!-- Textwechsel (beim Rollover) mit Blind.gif-Container-->
<layer id="textlayer"><div id="text" style="position:absolute; left:30px; top:360px;"></div></layer>
</body>
</html>