DeGoly
Hi,
ich möchte in meiner Navigation Mouse Over verwenden, der wie folgt klappen soll.
Ich habe das Image "start.png" und "startH.png".
Nun soll beim drüberfahren ein anderes Images kommen, logisch.
Aber weiterhin habe ich das Image "news.png" und "newsH.png".
Das heißt, dass ich für jedes Image ne andere Class anlegen muss, aber wie lautet dann der Code zum einbinden ?
LG
Dizzy.w3
Hi,
also, ich halte das nicht für sonderlich sinnvoll. Erzeugt eine ordentliche Redundanz, und der CSS-Vorteil wird nicht effizient genutzt. (Bei deinem Vorschlag - jedem eine eigene Klasse zuzuweisen - sollte man zudem eher IDs nehmen, die sind für solche Zwecke gedacht.
Optimaler wäre es eine background.png und eine backgroundHover.png zu haben, und der jeweilige Text wird als Text niedergeschrieben. Das wäre beispielsweise so lösbar:
| code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
|
.topNaviElement
{
background: url(images/background.png);
display: inline;
padding-left: 3px;
padding-right: 3px;
}
.topNaviElement:hover
{
background: url(images/backgroundHover.png);
display: inline;
} |
|
und in deinem HTML-Dokument (wo die CSS-Deklarierungen inkludiert sein müssen(!)) kann das zB so aussehen:
| code: |
1:
2:
3:
4:
5:
|
<ul style="display: inline;">
<li class="topNaviElement">asdf</li>
<li class="topNaviElement">asdf</li>
<li class="topNaviElement">asdf</li>
</ul> |
|
Sieht am Ende dann so aus, dass deine Elemente in einer Reihe stehen, mit einem Abstand insgesamt 6px zu nächsten Element.
Gruß
Dizzy
DeGoly
Hi,
ja id´s meinte ich, bin noch net so bewandert mit CSS.
Ich möchte es ja mit Images haben.
Das würde heißen, dass jede class (?) 2 Images hat.
Ist eh nur meine private Page, da ist das net so schlimm.
Danke
Maverick38
Das würde ich nicht mit Css machen, mach das mit Jvascript bzw. Java, das ist leichter und da gibt es einen festen Code!
Häfner
Allerdings muss JS ewig vorladen.
Würde CSS empfehlen - ist schneller und einfacher!