Andere Option für :focus ?

03/03/2018 20:35 Cc_Cc_Cc#1
Tag,

ich hab bei meiner Seite 2 A-Tags(Links) eingefügt. Wenn ich auf Personen klicke zeigt er mir halt per GET alle Personen auf. Wenn ich Beiträge klicke, zeigt er Beiträge. Jetzt wollte ich es so machen, das er auch anzeigt, das ich auf Personen oder halt auf den Link "Beiträge" drauf bin so wie im Bild:


1. Der untere Box-Shadow unter dem Link , der soll direkt beim Aufruf der Seite da sein, da erstmal alle Personen angezeigt werden.
2. Gibts eine Alternative anstatt Focus? Wenn ich z.b auf etwas anderes Klicke, verschwindet es ja. Aber der Box-Shadow soll ja zeigen , das er grad auf dieser Seite ist.
03/03/2018 20:47 Devsome#2
Du kannst auf deiner Seite mit $_GET['DeinParameter'] eine abfrage machen bei den Links. So das wenn du auf Personen bist oder Beiträge das wenn der GET gesetzt ist die css Klasse "active" oder halt boxshadow anzeigt :3
03/03/2018 20:48 iMostLiked#3
An deiner Stelle würde ich der ausgewählten Seiten eine Klasse verpassen statt mit ":focus" zu arbeiten.. macht keinen Sinn, da wenn das Element den Fokus verliert, der Style verschwindet.
Lädt die Seite neu, sobald du auf "Personen" oder "Beiträge" klickst? Falls ja, lässt sich das mit PHP realisieren. Folgendermaßen:

Code:
<a href="/?site=personen" class="<?php if ($_GET["site"] == "personen") { echo "active"; } ?>">Personen</a>
Und als CSS dann:

Code:
.active {
  // dein CSS
}
Wenn du die Seite aber mit AJAX lädst, kannst du das ganze auch mit jQuery bzw. Javascript realisieren.
Hierfür die entsprechende Funktion einfach im onclick() Attribut anhängen.