Supportnet / Forum / Webseiten/HTML
link active in php/css
Frage
Hallo!
Ich habe zwar schon die SuFu bemüht, war aber nicht wirklich erfolgreich, die gefundenen Antworten helfen mir nicht wirklich weiter.
Also, folgendes Problem:
ich habe eine php seite deren menu aus div-containern besteht. wird ein menupunkt angeklickt, so lädt die seite neu mit entsprechendem content. das menu bleibt gleich. mouse-over ist kein thema, ich hätte aber auch gerne das der zuvor angeklickte link, also der "aktive" link weiterhin farbig unterlegt bleibt damit man sieht wo man ist.
was ich mir überlegt hatte wäre ein php switch der dem angeklickten link (übergeben per variable) eine andere class zuweist.
[i]<div class="<?php switch($section){
case "1": echo "menuon"; break;
default: echo "menu"; break;
}?>"><a href="index.php?section=1content=2" title="Link1">Link1</a></div>[/i]
... finde ich aber nicht ideal, da ich ein cms verwende und nicht immer einfluss auf die übergebenen variablen habe.
daher meine frage:
[b]ist das möglich nur mit css?[/b] falls nicht, wie müßte zB ein entsprechendes JS-script aussehen? evtl hat ja jemand einen Beispiellink.
Vielen Dank schon mal
MfG
mrm
Antwort 1 von rfb
nur mit CSS gehts nicht (siehe: https://supportnet.de/threads/1342368)
Dieses JavaScript untersucht alle Links innerhalb des Elements (zB. ein DIV) mit der ID "menue" und prüft ob deren Zieladresse zur aktuell geladenen Seite gehört, in diesem Fall wird der Style des Links (hier: Hintergrundfarbe) geändert. Aufgerufen wird die Funktion mit
Dieses JavaScript untersucht alle Links innerhalb des Elements (zB. ein DIV) mit der ID "menue" und prüft ob deren Zieladresse zur aktuell geladenen Seite gehört, in diesem Fall wird der Style des Links (hier: Hintergrundfarbe) geändert. Aufgerufen wird die Funktion mit
<body onload="wobinich()">function wobinich() {
var geladen=window.location.href;
var menue = document.getElementById("menue").childNodes;
for (var k=0; k<menue.length;k++) {
var a=menue[k].childNodes;
for (var j=0; j<a.length; j++) {
if (a[j].nodeName.toLowerCase()=="a") {
if (geladen.indexOf(a[j].href)>=0) {
a[j].style.backgroundColor="#ffff5a";
}}}}}