Navigation mit Java Script

  • Hallo liebes Forum,


    Ich bin neu hier und habe direkt mal eine Frage.


    Und zwar bin ich derzeit dabei, eine eigene Webseite zu machen, um in dem Thema CSS&HTML fit zu bleiben. Javascript ist aber ziemliches Neuland, daher würde ich mich über Erklärung zur Lösung auch freuen. :)


    Zur Frage:


    Ich habe eine Navigation, die man über ein Hamburger Menü ein und ausblenden kann. Soweit bin ich also schon ^^ Jetzt möchte ich aber, dass wenn ich auf einen Link klicke, dass die Navigation dann auch wieder zu geht. Bisher muss man sie leider "per Hand" schließen.


    Zudem habe ich in der gesamten Seite, eine "shrink" Funktion eingebaut, weil es ein Onepager werden soll, damit sich header/footer beim scrollen verändern, also nicht wundern. :)


    Vielleicht hat ja jemand eine Idee, anbei mein Code:


    HTML-Navi:


    CSS:


    und mein Javascript:


  • du brauchst doch nur ein befehl wenn du auf ein a element klickentust er das menü schliesst


    Code
    1. $( "a" ).click(function() {
    2. //$( ".cross" ).click(function() {
    3. $( ".menu" ).slideToggle( "slow", function() {
    4. $( ".cross" ).hide();
    5. $( ".hamburger" ).show();
    6. });
    7. //});
    8. });

    habe das mal gerade so auf die schnelle um dein schlies ding rumgebaut.

    aber so klappt es zumindest

    https://jsfiddle.net/basti1012/enngo45b/

  • Hallo basti1012


    vielen dank für deine schnelle Antwort, das ist genau was ich gesucht habe. Wenn ich das richtig sehe, hast du einfach nur die Zeile ergänzt, oder?:

    Code
    1. $( "a" ).click(function() {


    Entschuldige die dumme Nachfrage, aber würde es gerne auch nachvollziehen können :)


    Edit:


    So, habe deinen Teil eingefügt und das funktioniert super! Danke! Leider kann ich die Navigation jetzt nicht mehr mit dem "x" schließen. Ist ja klar, du hast das auskommentiert. Hab versucht diesen "function"-Block einfach zweimal einzufügen, aber dann funktioniert das ganze gar nicht mehr. Wie krieg ich das hin, das man die Navi sowohl über einen Link als auch über das x schhließen kann? Geht das überhaupt? :/


    Vielen Dank & Liebe Grüße

  • ja ehrlich gesagt hätte ich jetzt eine idee gehabt die so 3-4 zeilen code gebraucht hätten.

    jetzt sind es nur 7 buchstaben geworden:D


    ich habe jetzt sinnlos paar experimente gemacht und eine lösung gefunden,wo ich selber nicht weiss warum das geht.

    ich weiss nicht mal ob man das überhaupt so machen kann in jquery,ob das ein regelgerechter code ist ,den alle benutzen.

    hier kuck selber

    https://jsfiddle.net/basti1012/enngo45b/1/


    ich muss jetzt erstmal selber googeln ob man das so machen kann,weil funktionieren tuts bei mir