Supportnet Computer
Planet of Tech

Supportnet / Forum / Webseiten/HTML

css-active link geht nicht im firefox





Frage

Hallo, da ich diesen Beitrag vor 2 Tagen im falschen Forum gepostet habe, poste ich es hier noch mal im richtigen und hoffe, dass mir hier jemand helfen kann? Ich habe mit css folgende css Klassen für meine Links definiert: a.menulink { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; text-decoration:none; } a.menulink:link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; text-decoration:none; display:block;} a.menulink:visited { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; text-decoration:none; } a.menulink:hover { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; display:block; width:150px; background-color:#506A9B; text-decoration:none; } a.menulink:active { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; display:block; width:150px; background-color:#506A9B; text-decoration:none; } Eigentlich interessiert hier nur der hover und active Link, denn ich möchte, dass wenn man über einen Link fährt ein Block angezeigt wird und dieser beim draufklicken auch dorf bleibt. Im IE funzt es auch wunderbar, aber im Firefox (hab die neuester Version 1.0.6 drauf) funzt nur der hover, bei active ist der block weg. Hat jemand eine Lösung für das Probem? Danke, Kathrin

Antwort 1 von MoRe99

Einfache Antwort: :active entspricht nicht dem JavaScript-Befehlt onClick, sondern onMousedown. D. h., die Pseudoklasse :active wird nur in dem Moment dargestellt, wenn du die Maustaste drückst. Sobald du die wieder los lässt, ist der Effekt wieder weg. Dies gilt für die Nicht-IE-Browser.

Quellen für diese Aussage:
Validome
jswelt
SelfHTML

Von daher kann ich dir leider auch keine Lösung bieten für das Problem, denn JavaScript ist nun gar nicht mein Ding. Vielleicht helfen dir die Hinweise aber auch schon mal etwas weiter.

P.S.: Fasse mal deine CSS-Deklarationen mal sinnvoll zusammen; spart Code und hilft der Übersichtlichkeit. ;-)

Antwort 2 von rfb

siehe https://supportnet.de/threads/1124334 -> Antwort 2 (wenigstens antworten könntest du mal)

Antwort 3 von MoRe99

@rfb, als Antwort auf deine Antwort im von dir verlinkten Thread:

Ich denke, dass Kathrin eher das meint, dass der Link in einer besonderen Art dargestellt werden soll, der gerade aktiv ist, d. h. dann, wenn die Seite zu sehen ist, die durch den betreffenden Link aufgerufen wird. Würde man die Deklaration bei :visited hineinpacken würde ja jeder Link, der bereits besucht wurde, so dargestellt.

Antwort 4 von kathrin77

@rfb:
Entschuldigung, ich habe Deine Antwort nicht gelesen (wahrscheinlich alte Seiten im Cache oder so :-(, sorry).

@MoRe99
Genau so meinte ich das :-). Von JavaScript bin ich kein Fan, dann würde ich lieber drauf verzichten den Effekt zu nehmen, als dass ich JS nehmen. Die Seite soll nämlich in einer Firma laufen und da ist JS meist deaktiviert! Wie fasse ich den Code denn zusammen?

Ich denke, wir sollten uns auf diesen Thread beschränken, damit die nicht doppelt laufen.

Antwort 5 von rfb

zusammenfassen:

das was bei a.menulink steht gilt automatisch für alle Pseudoklassen (:link, :visited ...), du brauchst nur immer anzugeben, was sich ändern soll.

Antwort 6 von kathrin77

Ok, das mache ich mal, danke :-)

Antwort 7 von MoRe99

Auf die Schnelle zusammengefasst, ohne selber zu testen:

a.menulink {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #0000FF;
  text-decoration:none;
  }

a.menulink:link, a.menulink:hover, a.menulink:active {
  display:block;
  }

a.menulink:hover, a.menulink:active {
  width:150px;
  background-color:#506A9B;
  }


Probiers mal aus, ob es sich genauso verhält wie dein Code. Wenn ja, isses gut, wenn nein melde dich nochmal.

Ansonsten: schau mal nach bei thestyleworks.de.

Antwort 8 von MoRe99

Noch eine Nachfrage. Warum gibst du der Pseudoklasse :link zwar ein display:block mit, aber keine Breite?

Antwort 9 von rabies

Eine andere Frage auf die Nachfrage: Wieso gibt man einem Block eine feste Breite? Wenn man padding reinbasteln würde, würde sich das ganze auch von selbst anpassen.

Antwort 10 von MoRe99

SelfHTML; die Erläuterung unter dem dritten Beispielcode.
css4you; ganz unten auf der Seite.

Antwort 11 von rabies

Naja gut, ich zieh´ den anrüchigen Kommentar zurück. Ich hab´s außer acht gelassen, dass das ganze in einem Menu (mit fester Breite) verarbeitet werden soll.

Antwort 12 von MoRe99

War doch nix anrüchiges an deinem Kommentar. ;-) Meine Antwort fiel so kurz und knapp aus, weil ich vorhin schnell weg musste.

Antwort 13 von kathrin77

@MoRe99
Die Beispiele sind echt gut. Die werde ich mir mal genauer ansehen und wenn ich Probleme habe, meld ich mich noch mal ;-)! Danke erst mal! Sieht schon mal vielversprechend aus :-).

Kathrin

Antwort 14 von MoRe99

Der Thread ist zwar ein paar Tage alt, aber gerade eben habe ich einen Link gefunden, wo eine Art Workaround beschrieben wird, mit dessen Hilfe man einem Link, wenn er aktiv ist, eine besondere Formatierung zuweisen kann.

Aktuellen Link mit CSS hervorheben

Ich möchte kostenlos eine Frage an die Mitglieder stellen:


Ähnliche Themen:


Suche in allen vorhandenen Beiträgen: