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

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

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.
 
Werbung:
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.
 
Werbung:
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.

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");
}
 
Werbung:
Zurück
Oben