Gruppen

Top Gruppen: Windows 7; Windows Vista; Windows XP; Textverarbeitung; Excel; DSL; Internet Browser; E-Mail/Outlook
Betriebsysteme: Windows classik; Linux; BS-Sonstige
Software: Datenbanken; Bildbearbeitung; Audio/mp3/Video; Security/Viren; SW-Sonstige
Hardware: Mainboard/CPU; Grafikkarten; Peripherie; Laptop/Notebook; HW-Sonstiges
Netzwerk: Telefon,ISDN,Modem; W-Lan; NW-Sonstiges
Programmierung: PHP,ASP,Perl...; Java,C++...; Webseiten/HTML
Sonstiges: PC-Sonstiges; Plauderecke; SN Intern; Test

/ Forum / Webseiten/HTML

Webseiten/HTML

Fragevon Rayn0r vom 08.03.2020, 12:45 Options

:active nur während click? (css)

Leider scheint :active nur den Fall anzusprechen, wo man mit der Maus auf etwas clickt und die Maustaste gedrückt lässt.
Ich brauche aber etwas, mit dem man anzeigen kann, auf welcher Seite man sich gerade befindet (z.B. das zuletzt angewählte Menu-item hat eine andere Farbe). :active müsste also quasi bis zum nächsten click dauern und nicht nur bis man die Maustaste wieder loslässt.
Kann man so etwas mit CSS machen?

MfG
Ghost

Antwort schreiben

Antwort 1 von katy vom 08.03.2020, 13:04 Options

Hallo Ghost,

das ist mit CSS nicht zu machen. Es gehört aber auch zu den eher unschönen Sachen, auf die Seite einen Link zur Seite zu schreiben. Sinnvoller ist es dann, diesen Teil in der Navi einfach vin vornherein nicht als Link zu schreiben. Bei dynamischen Seiten kann dies zB PHP übernehmen. Und diesem Teil der Navi kannst du dann natürlich das gleiche CSS geben wie a:active.

Alternativ gäbe es noch JavaScripte, die nachträglich aller Links auf der Seite durchlaufen, prüfen ob href mit der URL der Seite übereinstimmt und dann CSS-Zuweisungen anpassen.

katy

Antwort 2 von Rayn0r vom 08.03.2020, 15:14 Options

Ja das habe ich mir leider schon gedacht.
PHP kommt leider nicht in Frage, schon nur weil ich davon keine Ahnung habe.

JavaScript wäre wohl die beste Lösung für mich, da kenne ich mich aber auch nicht so gut aus. Ich habe vorhin ein wenig daran rumgebastelt, hat aber nicht funktioniert. Ich wollte mit onMousedown den style (die Farbe) ändern.

Wie funktioniert denn das script mit dem URL-Vergleich?
Danke

Antwort 3 von katy vom 08.03.2020, 17:22 Options

Hallo Ghost,

Das Skript funktioniert so:

<script type="text/javascript">
function init() {
 nav = document.getElementById("navi") {
 if (nav) {
/* gibts eine navi? */
  var dieseSeite=window.location.href;
/* aktuelle URL holen */
  var links = nav.getElementsByTagName("a");
/* eine Liste (Array) aller Links in der Navi anlegen */
  for (var a=0; a<links.length; a++) {
/* bei jedem Element des Arrays ... */
   if (dieseSeite.indexOf(links[a].getAttribute("href"))>=0) links[a].className = "aktiv";
/* ... prüfen ob das Linkziel zumindest teilweise der URL entspricht und dann die Klasse aktiv setzen */
  }
 }
}

window.onload = init;
/* wenn Seite geladen mit der Funktion init beginnen */
</script>

Du müsstest das Skript du im head-Bereich unterbringen. Und deiner Navi die id="navi" geben.
Außerdem im CSS noch die Klasse aktiv berücksichtigen, zB indem du
a:active
ergänzt zu
a.aktiv, a:active

Probleme könnte es eigentlich nur geben, wenn du window.onload schon verwendest oder im <body> ein onload-Attribut verwendest.

katy

Hinweis

Diese Frage ist schon etwas älter, Sie können daher nicht mehr auf sie antworten. Sollte Ihre Frage noch nicht gelöst sein, stellen Sie einfach eine neue Frage im Forum..

Neue Einträge

Tipp einschicken

News einschicken