nicht angemeldet
Moin,
einmal vorab:
Sorry, falls ich hier im falschen Themenbereich bin oder es das Problem schon mal gab. Zum einen weiss ich nicht wo genau der Fehler liegt (HTML oder JavaScript) und zum anderen kämpfe ich mich seit gestern via google und selfhtml durch, habe bisher aber nichts gefunden, was mir weiterhelfen konnte :/
Ich habe ein Javascript, mit dem die einzelnen Menübilder beim "onmouseover" und "onmouseout" ausgetauscht werden um einen Farbwechsel-Effekt zu erzielen.
Das funktioniert auch Prima, das Problem ist jedoch, dass das Menü völlig falsch angezeigt wird, sofern ich weitere Grafiken in die HTML Datei einbinde.
z.B.:
Das funktionierende Menü:
http://pimmelgicht.de/index.php
Der HTML Quellcode:
<table cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/halter_links.jpg" width="51" height="29" border="0" onmouseover="Bildwechsel(0, Highlight7)" onmouseout="Bildwechsel(0, HalterLinks)" />
</td>
<td>
<a href="index.php" onmouseover="Bildwechsel(1, Highlight1)" onmouseout="Bildwechsel(1, Menu1)">
<img src="images/home_off.jpg" width="110" height="29" border="0" /></a>
</td>
<td>
<a href="about.php" onmouseover="Bildwechsel(2, Highlight2)" onmouseout="Bildwechsel(2, Menu2)">
<img src="images/about_off.jpg" width="139" height="29" border="0" /></a>
</td>
<td>
<a href="work.php" onmouseover="Bildwechsel(3, Highlight3)" onmouseout="Bildwechsel(3, Menu3)">
<img src="images/work_off.jpg" width="157" height="29" border="0" /></a>
</td>
<td>
<a href="member.php" onmouseover="Bildwechsel(4, Highlight4)" onmouseout="Bildwechsel(4, Menu4)">
<img src="images/member_off.jpg" width="150" heigth="29" border="0" /></a>
</td>
<td>
<a href="contact.php" onmouseover="Bildwechsel(5, Highlight5)" onmouseout="Bildwechsel(5, Menu5)">
<img src="images/contact_off.jpg" width="138" heigth="29" border="0" /></a>
</td>
<td>
<img src="images/halter_rechts.jpg" width="47" height="29" border="0" onmouseover="Bildwechsel(6, Highlight8)" onmouseout="Bildwechsel(6, HalterRechts)" />
</td>
</tr>
</table>
Das Java Script (im Verzeichnis /js):
Menu1 = new Image();
Menu1.src = "images/home_off.jpg";
Highlight1 = new Image();
Highlight1.src = "images/home_on.jpg";
Menu2 = new Image();
Menu2.src = "images/about_off.jpg";
Highlight2 = new Image();
Highlight2.src = "images/about_on.jpg";
Menu3 = new Image();
Menu3.src = "images/work_off.jpg";
Highlight3 = new Image();
Highlight3.src = "images/work_on.jpg";
Menu4 = new Image();
Menu4.src = "images/member_off.jpg";
Highlight4 = new Image();
Highlight4.src = "images/member_on.jpg";
Menu5 = new Image();
Menu5.src = "images/contact_off.jpg";
Highlight5 = new Image();
Highlight5.src = "images/contact_on.jpg";
Menu6 = new Image();
Menu6.src = "images/impressum_off.jpg";
Highlight6 = new Image();
Highlight6.src = "images/impressum_on.jpg";
HalterLinks = new Image();
HalterLinks.src = "images/halter_links.jpg";
Highlight7 = new Image();
Highlight7.src = "images/halter_links.jpg";
HalterRechts = new Image();
HalterRechts.src = "images/halter_rechts.jpg";
Highlight8 = new Image();
Highlight8.src = "images/halter_rechts.jpg";
function Bildwechsel (Bildnr, Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
Wenn ich nun zusätzlich einen Header über dem Menü ausgeben möchte, funktioniert gar nix mehr :-(
HTML-Code:
<table cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/halter_links.jpg" width="51" height="29" border="0" /> <!-- Irgend eine Grafik -->
</td>
</tr>
</table>
<table cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/halter_links.jpg" width="51" height="29" border="0" onmouseover="Bildwechsel(0, Highlight7)" onmouseout="Bildwechsel(0, HalterLinks)" />
</td>
<td>
<a href="index.php" onmouseover="Bildwechsel(1, Highlight1)" onmouseout="Bildwechsel(1, Menu1)">
<img src="images/home_off.jpg" width="110" height="29" border="0" /></a>
</td>
<td>
<a href="about.php" onmouseover="Bildwechsel(2, Highlight2)" onmouseout="Bildwechsel(2, Menu2)">
<img src="images/about_off.jpg" width="139" height="29" border="0" /></a>
</td>
<td>
<a href="work.php" onmouseover="Bildwechsel(3, Highlight3)" onmouseout="Bildwechsel(3, Menu3)">
<img src="images/work_off.jpg" width="157" height="29" border="0" /></a>
</td>
<td>
<a href="member.php" onmouseover="Bildwechsel(4, Highlight4)" onmouseout="Bildwechsel(4, Menu4)">
<img src="images/member_off.jpg" width="150" heigth="29" border="0" /></a>
</td>
<td>
<a href="contact.php" onmouseover="Bildwechsel(5, Highlight5)" onmouseout="Bildwechsel(5, Menu5)">
<img src="images/contact_off.jpg" width="138" heigth="29" border="0" /></a>
</td>
<td>
<img src="images/halter_rechts.jpg" width="47" height="29" border="0" onmouseover="Bildwechsel(6, Highlight8)" onmouseout="Bildwechsel(6, HalterRechts)" />
</td>
</tr>
</table>
Das ganze sieht dann so aus:
http://pimmelgicht.de/index2.php
Vielleicht bin ich auch einfach nur Blind heute. :-(
Greetz
1848er