• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Frage Navbar Menüpunkte Class "active" setzen, nehmen

D

DerNeuling21

Mitglied
Hallo zusammen,

ich habe folgenden Aufbau meiner Seite:

/Punkt1/index.php
/Seite2Punkt1.php

/Punkt2/index.php
/Seite2Punkt2.php

/Punkt3/index.php
/Seite2Punkt3.php

/navbar.html

Alle Seiten haben die navbar.html included. Die Menüpunkte der Navbar verweisen immer auf die Index Seite des jeweiligen Punktes.
Wie kann ich jedoch immer dem geöffneten/ verwendeten Menüpunkt die "active" Klasse setzen ?
Soll auch bei den anderen Dateien in einem Menüpunkt funktionieren.

Wenn ich z.B.: Seite2Punkt3.php öffne soll dem Navbar Punkt "Punkt3" die "active" Klasse gesetzt werden.

Danke für eure Hilfe.
 
Das Einfachste wäre, wenn du direkt vor dem 'include' des Navbars eine Variable setzt... zB $menueposition=1... und dann mit einer einfachen if-Abfrage in deiner 'navbar.php' bei dem entsprechenden Menüpunkt eine echo- Ausgabe machst, die dir die Klasse einfügt.
 
Hab das jetzt mal mit Javascript probiert, klappt aber nicht. Kein Plan warum.

Javascript:

Javascript: 
function setActive(i) {
$(document).ready.getElementById(i).addClass("active");
}

in der HTML Datei:

HTML: 
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript" src="../js/main.js"></script>

    <script>
        setActive("contact");
    </script>
</head>

Warum klappt das nicht ?
Andere Javascript Sachen aus der Datei funktionieren auch.
 
DerNeuling21 schrieb:
Hab das jetzt mal mit Javascript probiert, klappt aber nicht. Kein Plan warum.

Javascript:

Javascript: 
function setActive(i) {
$(document).ready.getElementById(i).addClass("active");
}

in der HTML Datei:

HTML: 
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript" src="../js/main.js"></script>

    <script>
        setActive("contact");
    </script>
</head>

Warum klappt das nicht ?
Andere Javascript Sachen aus der Datei funktionieren auch.
Zum Vergrößern anklicken....

Code: 
function setActive(i) {
    document.getElementById(i).addClass("active");
}
 
Was sagt die Fehlerkonsole ?Du nutzt doch jquery oder? Was ist den hier mit ?
Javascript: 
function setActive(i) {
$('#'+i).addClass("active");
}
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben