Mobiles Menü, das beim Klicken geschlossen wird.

Ich habe stackoverflow schon oft in der Vergangenheit benutzt, um meine Programmierprobleme zu lösen, aber diesmal konnte ich nicht die richtige Antwort finden, also habe ich mich angemeldet und entschieden, die Frage selbst zu stellen.Mobiles Menü, das beim Klicken geschlossen wird.

TBH, ich bin nicht sehr gut, wenn es um das Codieren geht, verwende ich meine grundlegenden CSS, HTML und PHP-Kenntnisse, um ein paar gut aussehende WordPress-Seiten für meine Freunde zu machen.

Ich weiß, dass die Frage oben hier schon einmal gestellt wurde, aber ich weiß wirklich nicht, wie ich die Antworten anwenden kann, die ich in meinem Fall finden konnte.

Dies ist die Website, an der ich gerade arbeite: http://serwer1652796.home.pl.

Ich möchte, dass das mobile Menü geschlossen wird, wenn jemand auf einen der Links klickt. Ich weiß, dass ich wahrscheinlich Javascript-Code in einer der Theme-Dateien verwenden muss, aber was genau soll ich schreiben und in welcher Datei? (Ich habe noch nie zuvor mit js beschäftigen, also bitte, sein Verständnis.)

Quelle

2016-06-09 Bartek

Können Sie einige Code hinzu:

<script> $(".onepress-menu li a").on("click", function() { $(".onepress-menu").toggleClass("onepress-menu-mobile"); }); </script>

können Sie die Wirkung hier emuliert sehen? –

Ich bin mir nicht sicher, aber hier sind die menübezogenen Zeilen, die ich in .js-Dateien gefunden habe. 1. bootstrap.js http://s33.postimg.org/xpm0oaxan/Zrzut_ekranu_2016_06_09_o_20_00_37.png 2. theme.js http://s33.postimg.org/9zjpx4snj/Zrzut_ekranu_2016_06_09_o_20_01_52.png – Bartek

In der theme.js Datei auf der Linie 260 gibt Code,

jQuery('.home #site-navigation li a[href*=#]').on('click', function(event){ 
    event.preventDefault(); 
    smoothScroll(jQuery(this.hash)); 
});

Um so aussieht das schließen Menü, müssen Sie einige Zeilen hinzufügen, um einige CSS-Klassen für verschiedene Elemente zu aktivieren, die scheinbar die Sichtbarkeit des Menüs steuern. Es sollte

jQuery('.home #site-navigation li a[href*=#]').on('click', function(event){ 
    event.preventDefault(); 
    smoothScroll(jQuery(this.hash)); 
    jQuery('#nav-toggle').toggleClass('nav-is-visible'); 
    jQuery('.main-navigation .onepress-menu').toggleClass("onepress-menu-mobile"); 
    jQuery('.header-widget').toggleClass("header-widget-mobile"); 
});

wie diese später sehe ich die zusätzlichen Linien bekam von den Ereignissen hinzufügen, die auftreten, wenn Sie manuell das Menü über das X Symbol schließen, die in theme.js auf den Linien 7, 8 und 9 zu finden sind.

Quelle

2016-06-09 18:07:56 shamsup

Vielen Dank! Es funktioniert einfach großartig. – Bartek

Ich sehe Ihr Thema ist mit Jquery. Sie können so etwas zu der footer.php Datei hinzufügen:

jsfiddle

Quelle

2016-06-09 18:18:53

Mobiles Menü, das beim Klicken geschlossen wird.

Antwort

Verwandte Themen