Hallo,
ich bin neu in diesem Forum, aber muss erst mal ein Kompliment loswerden. Super aufgebaut und nette kluge Menschen, die mir bisher schon um einiges weitergeholfen haben.
Habe aber nun folgendes Problem: Wollte mein HP erstellen und der linke Frame (name="links") ist der Navigator sozusagen. Die Links sollen über eine Art Joystick angesteuert werden. Je nach Klick bewegt sich der Joystick in die entsprechende Richtung mit einem animierten GIF. Ein Link, der das wieder auf den Anfang setzt (den Joystick in die Mitte), muss nun auf das entsprechende GIF zugreifen, aber das ist ja je nach Auswahl ein anderes.
Wenn der Stick also gerade links oben war, muss auch das GIF geladen werden, dass er wieder von links oben in die Mitte kommt und nicht von rechts unten oder so.
So sieht mein Quelltext aus:
Code:
<html>
<head>
<title>Navigation</title>
<link rel="stylesheet" Type="text/css" href="definition.css" />
</head>
<body>
<body background="../img/back_links.jpg" bgproperties="fixed">
<br><br>
<p class="klein" align="center">
Logo
</p>
<table border="0" width="150" height="150">
<tr>
<td width="150">
<img id="standpunkt" src="../img/butt/news_stand.jpg" width="150" height="113">
</td>
</tr>
</table>
<table border="0" width="260" height="40">
<tr>
<td align="center">
<img id="navi" src="../img/butt/blank.gif" width="200" height="31" border="0">
</td>
</tr>
</table>
<p align="left">
<map name="mapknauf">
<area shape="rect" coords="130,93,142,107" href="mich.htm" target="mainFrame" alt="R wie Robse" onclick="document.images.standpunkt.src='../img/butt/mich_stand.jpg'; document.images.knauf.src='../img/navi_1.gif'" onmouseover="document.images.navi.src='../img/butt/mich.gif'" onmouseout="document.images.navi.src='../img/butt/blank.gif'">
<area shape="rect" coords="144,93,155,107" href="freunde.htm" target="mainFrame" alt="Freunde" onclick="document.images.standpunkt.src='../img/butt/freunde_stand.jpg'; document.images.knauf.src='../img/navi_2.gif'" onmouseover="document.images.navi.src='../img/butt/freunde.gif'" onmouseout="document.images.navi.src='../img/butt/blank.gif'">
<area shape="rect" coords="157,93,171,107" href="??? forum ???" target="mainFrame" alt="Forum" onclick="document.images.standpunkt.src='../img/butt/forum_stand.jpg'; document.images.knauf.src='../img/navi_4.gif'" onmouseover="document.images.navi.src='../img/butt/forum.gif'" onmouseout="document.images.navi.src='../img/butt/blank.gif'">
<area shape="rect" coords="173,93,185,107" href="kontakt.htm" target="mainFrame" alt="Kontakt" onclick="document.images.standpunkt.src='../img/butt/kontakt_stand.jpg'; document.images.knauf.src='../img/navi_6.gif'" onmouseover="document.images.navi.src='../img/butt/kontakt.gif'" onmouseout="document.images.navi.src='../img/butt/blank.gif'">
<area shape="rect" coords="144,128,156,141" href="partypics.htm" target="mainFrame" alt="Partypics" onclick="document.images.standpunkt.src='../img/butt/party_stand.jpg'; document.images.knauf.src='../img/navi_3.gif'" onmouseover="document.images.navi.src='../img/butt/party.gif'" onmouseout="document.images.navi.src='../img/butt/blank.gif'">
<area shape="rect" coords="158,128,170,141" href="hyperlinks.htm" target="mainFrame" alt="Links" onclick="document.images.standpunkt.src='../img/butt/links_stand.jpg'; document.images.knauf.src='../img/navi_5.gif'" onmouseover="document.images.navi.src='../img/butt/links.gif" onmouseout="document.images.navi.src='../img/butt/blank.gif'">
</map>
<img id="knauf" src="../img/butt/knauf_leerlauf.gif" width="260" height="223" border="0" alt="Navi" usemap="#mapknauf">
</p>
<p align="center">
<a href="news.htm" target="mainFrame" alt="Zurück zu den News">
<img id="leerlauf" src="../img/butt/leerlauf_out.gif" width="190" height="30" border="0" onclick="javascript:zurueckSchalten(); document.images.standpunkt.src='../img/butt/news_stand.jpg'" onmouseover="document.images.leerlauf.src='../img/butt/leerlauf_over.gif'" onmouseout="document.images.leerlauf.src='../img/butt/leerlauf_out.gif'">
<script type="text/javascript">
function zurueckSchalten ()
{
if (document.getElementById("knauf").src.indexOf("navi_1.gif") > -1)
{
document.getElementById("knauf").src = "../img/navi_zurueck_1.gif";
return;
}
if (document.getElementById("knauf").src.indexOf("navi_2.gif") > -1)
{
document.getElementById("knauf").src = "../img/navi_zurueck_2.gif";
return;
}
if (document.getElementById("knauf").src.indexOf("navi_3.gif") > -1)
{
document.getElementById("knauf").src = "../img/navi_zurueck_3.gif";
return;
}
if (document.getElementById("knauf").src.indexOf("navi_4.gif") > -1)
{
document.getElementById("knauf").src = "../img/navi_zurueck_4.gif";
return;
}
if (document.getElementById("knauf").src.indexOf("navi_5.gif") > -1)
{
document.getElementById("knauf").src = "../img/navi_zurueck_5.gif";
return;
}
if (document.getElementById("knauf").src.indexOf("navi_6.gif") > -1)
{
document.getElementById("knauf").src = "../img/navi_zurueck_6.gif";
return;
}
}
</script>
</a>
</p>
</body>
</html>
Soweit funktioniert das so, aber es wird trotzdem Fehler auf der Seite angezeigt. Wenn ich das Script in den Head packe, funktioniert es aber gar nicht.
Könnt ihr mir helfen, wo da der Fehler ist? Ich find ihn einfach nicht
Oder ist das anders vielleicht viel einfacher zu machen???
Danke schon mal im Vorraus.
Schöne Grüße
Robse
