nicht angemeldet
OnMouseOver bei Text - Link hüpft
Hallo beisammen,
also ich habe ein grosses Problem bei meinen Stylesheet Definitionen. Und zwar habe ich in einer Navigation zwei Untermneüpunkte rein textuell angegeben. Beim Mausdrüberfahren soll sich die Hintergrundfarbe des Textes ändern und einen dünnen Rahmen darum ziehen.
Es klappt an sich schon wie gewollt. Nur fangen die Linkns an zu "hüpfen", das heisst sie bleiben nicht ruhig in ihrer Lage stehen, wie sie sollen.
Die erforderlichen Breiche sind
----------
HTML:
<tr>
<td width="150" height="20" class="navlist"><a href="xyz.htm">Aufgaben und Ziele</a></td>
</tr>
<tr>
<td width="150" height="20" class="navlist"><a href="zyx.htm">Gremien und Partner</a></td>
</tr>
---------
und CSS:
.navlist a {
font-family: Geneva,sans-serif, Arial, Helvetica, MS Sans Serif;
color: #000000;
font-size: 10px;
text-decoration: none;
margin: 5px;
padding: 2px 2px 2px 2px;
width: 20ex;
}
.navlist a:hover {
margin: 5px;
padding: 2px 2px 2px 2px;
display: block;
width: 20ex;
border-width: 1px;
border-style: solid;
border-color: #000000;
background-color: #B5D6CE;
}
----------
Den Bereich display:border; muss ich angeben, da sonst mein linkes Frame verunstaltet wird.
Die Seite ist zu sehen unter
www.rohrbold.de/ref31
Einfach den ersten Hauptmenüpunkt links anklicken.
Wäre über helfende Hinweise sehr dankbar.
MfG
Martin
-
Hallo beisammen,
also ich habe ein grosses Problem bei meinen Stylesheet Definitionen. Und zwar habe ich in einer Navigation zwei Untermneüpunkte rein textuell angegeben. Beim Mausdrüberfahren soll sich die Hintergrundfarbe des Textes ändern und einen dünnen Rahmen darum ziehen.
Es klappt an sich schon wie gewollt. Nur fangen die Linkns an zu "hüpfen", das heisst sie bleiben nicht ruhig in ihrer Lage stehen, wie sie sollen.
Die erforderlichen Breiche sind
HTML:
<tr>
<td width="150" height="20" class="navlist"><a href="xyz.htm">Aufgaben und Ziele</a></td>
</tr>
<tr>
<td width="150" height="20" class="navlist"><a href="zyx.htm">Gremien und Partner</a></td>
</tr>
und CSS:
.navlist a {
font-family: Geneva,sans-serif, Arial, Helvetica, MS Sans Serif;
color: #000000;
font-size: 10px;
text-decoration: none;
margin: 5px;
padding: 2px 2px 2px 2px;
width: 20ex;
}.navlist a:hover {
margin: 5px;
padding: 2px 2px 2px 2px;
display: block;
width: 20ex;
border-width: 1px;
border-style: solid;
border-color: #000000;
background-color: #B5D6CE;
}
Den Bereich display:border; muss ich angeben, da sonst mein linkes Frame verunstaltet wird.
Die Seite ist zu sehen unter
www.rohrbold.de/ref31
Einfach den ersten Hauptmenüpunkt links anklicken.Wäre über helfende Hinweise sehr dankbar.
MfG
Martindu hast beim hover-teil die font-size und family vergessen...
ausserdem dachte ich immer, es muss
a.navlist:hover {..} heißen ?? is mir neu, dass es so auch geht... :-) werd mcih mal schlau lesen-
Also das Problem ist gelöst. Man kann sich das Resultat noch anschauen unter www.rohrbold.de/ref31
Der Trick war, dass man schon in der Definition des Links die Geschichte mit dem Background angeben musste, nur eben "transparent", in meinem Fall in der Hintergrundfarbe.
Vielen Dank an Tilmann Kuhn hierfür (www.tkuhn.de)
Danke auch, dass ihr euch meines Problems angenommen habt.
Zu den anderen Definitionen - da scheint beides zu gehen. Ursprünglich hatte ich auch eure Variante benutzt.
Gruß
Martin
-
-
Hallo
»»...
Es klappt an sich schon wie gewollt. Nur fangen die Linkns an zu "hüpfen", das heisst sie bleiben nicht ruhig in ihrer Lage stehen, wie sie sollen.
Ich denke das Problem ist die Border, die beim Hover noch dazu kommt. Dadurch wird ja auf jeder Seite 1 Pixel dazuaddiert.
Versuche es vielleicht mal in der Definition von navlist mit
padding: 3px 3px 3px 3px;
bei navlist:hover wie gehabt mit
padding: 2px 2px 2px 2px;PS: muesste es nicht a.navlist und a.navlist:hover heissen???
Gruss, Mel