PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Dynamische Tabellenhintergrundbilder



Lukas
19.12.2004, 18:09
Hallo,

ich habe folgendes Problem:
ich will mir eine Navigation bauen, die auf einer Tabelle basiert. Ich möchte, dass eine Zelle, sobald sie vom Cursor berührt wird, ein Hintergrundbild zugewiesen bekommt (als wenn ich es mit background="bild.jpg" machen würde), und wenn der Cursor die Zelle wieder verlässt, soll das Bild wieder ausgeblendet werden (sprich: ein Teil der Navigation soll hervorgehoben werden, wenn er ausgewählt ist).
Wie mache ich das? Geht das mit Stylesheets oder muss ich Javascript verwenden (css wäre mir lieber)?

pazzi
19.12.2004, 18:34
Schade, dass wir soviele Posts verloren haben, genau die gleiche Frage hatte ich schon einmal gestellt und ich bekam eine schöne Beispiel Seite, wo ich mir den Code ansehen konnte.

Egal, muss ich es halt selber machen :D

Hier einmal der CSS Teil.

#navi a {
display:block;
width:120px;
height:15px;
border:1px solid black;
color:#000000;
font-size:10px;
background:#B9B9B9;
}
#navi a:hover {
background:#666666;
} Das meiste sollte selbsterklärend sein. Mit den ersten drei Angaben definierst du das "Feld" des Links, danach den Rahmen und zu guter letzt die Hintergrundfarbe, die immer angezeigt wird.Im "hover" musst du jetzt nur die Hintergrundfarbe definieren, die gezeigt werden soll, wenn der Link markiert ist. Natürlich kannst du auch direkt noch andere Eigenschaften ändern, aber eigentlich reicht der Hintergrund.

Auch auf die Gefahr hin, dass du es ohnehin schon weißt, damit es dann auch auf die Links angewand wird schreibst du folgendes in den Code:

<div id="navi">
<a href="#">Link</a>
<a href="#">Link</a>
<a href="#">Link</a>
</div> Im Beispiel war es jetzt zwar immer nur die Hintergrundfarbe allerdings gehe ich stark davon aus, dass du, wenn du ein Bild haben willst, die normale BG-Bild definition anstelle der BG-Color verwenden musst, ich selber hab bisher immer nur mit Farbe gearbeitet.

Lukas
19.12.2004, 18:45
Okay, das funktioniert soweit.
Danke für die Hilfe.