Header - Banner

[Droyer]

Moin Leute,

ich bräucht echt mal eure hilfe!

Ich möchte in mein Forum ein schönes Banner oben als Kopf haben... naja ist ja nicht so das ding, nur in den Banner sollen 4 Buttons sein, die auf bestimmte sachen verlinkt sind.

d.h. die farbe der felder im banner soll sich ändern, wenn die maus drüber geht und beim klick darauf soll er z.b. zu einer anderen internet seite weitergeleitet werden (is ja nicht so wichtig wohin)

hat jmd ne idee wie ich das am besten realisieren kann?

Also ich hab das Banner schon in mehrere Bilder geschnipselt ;-)

also hoffe es kann mir jmd helfen

[hcmagix]

na alles in eine Tabelle/div Container packen und per javascript die mouseover Geschichten realisieren. So würde ich es angehen.

[Droyer]

ich hab da noch nicht soviel erfahrung sowas selbst zu schreiben...
kann mir vielleicht jmd so ne grundstruktur der tabelle geben und wie man das mousover dazufügt ... dann könnt ich es mal so probieren

[hcmagix]

hier ist schon mal ein Anfang
http://www.webmaster-resource.de/tricks/javascript/tabellen-mit-mouseover-effekt.php

statt der Farbcodes solltest halt Deine Bildpfade verwenden.

[Droyer]

hey danke, nun sieht es bei mir so aus...

<table border="0" width="250">
<tr>
<td><img src="$html/banner/h1l.png"></td>
<td><img src="$html/banner/h1r.png"></td>
</tr>
<tr>
<td><img src="$html/banner/h2l.png"></td>
<td><img src="$html/banner/h2c.png"></td>
<td><img src="$html/banner/h2d.png"></td>
<td><img src="$html/banner/h2s.png"></td>
<td><img src="$html/banner/h2p.png"></td>
</table>

Probleme:
1. es gibt abstände zwischen den tabellen, wie bekomm ich die weg
2. ich will, dass der teil:

<td><img src="$html/banner/h2c.png"></td>
<td><img src="$html/banner/h2d.png"></td>
<td><img src="$html/banner/h2s.png"></td>
<td><img src="$html/banner/h2p.png"></td>

genau unter dem steht (also 4 spalten under 1 von der ersten zeile)

<td><img src="$html/banner/h1r.png"></td>

3. wie bau ich da jetzt das mousover rein, bekomm das nicht so hin ^^

ich weis bin nicht grad der könner in dem bereich aber ich will ja lernen ;-)
wär cool, wenn mir da jmd heflen könnte

[Andreas]

Ich würde das per CSS machen - hat den Vorteil dass es auch ohne aktiviertes JavaScript funktioniert :)

[Droyer]

das mein momentaner stand

<table border="0" width="100%" rules="none" cellspacing="0" cellpadding="0">
<tr>
<td><img src="$html/banner/h1l.png"></td>
<td><img src="$html/banner/h2.png" width="100%" height="70"></td>
<td><img src="$html/banner/h1r.png"></td>
</tr>
</table>
<table border="0" width="100%" rules="none" cellspacing="0" cellpadding="0">
<tr>
<td><img src="$html/banner/h2l.png"></td>
<td><img src="$html/banner/h2.png" width="100%" height="70"></td>
<td><img src="$html/banner/h2c.png"></td>
<td><img src="$html/banner/h2d.png"></td>
<td><img src="$html/banner/h2s.png"></td>
<td><img src="$html/banner/h2p.png"></td>
</tr>
</table>

jetzt will ich nurnoch, dass die tabelle sich dynamisch an den bildschrim anpasst, also so das es sich der auflösung anpasst...
aber nur der teil
<td><img src="$html/banner/h2.png" width="100%" height="70"></td>
in beiden tabellen ....
kann mir da einer helfen?

[Droyer]

kann mir keiner sagen wie ich das am blödsten an den bildschirm anpass?
bin echt richtig ratlos....

[Droyer]

nach ein paar stunden suchen und probieren und rätseln hab ich es jetzt alleine geschafft... also erledigt....