Hinzufügen von Noscroll-Klasse zu Körper im Menü klicken

Question

Ich verwende Unterstriche als Starter-Thema für Wordpress, und ich möchte eine "Noscroll" -Klasse zum Körperelement hinzufügen, wenn die Menüschaltfläche geöffnet ist, dann entfernen Sie es wenn das Menü geschlossen ist.

Ich habe versucht, diese Art der Sache Hinzufügen ...

$('body').addClass('noscroll');

... an die bestehende Navigation.js-Datei, die mit Unterstrichen kommt. Welche sieht wie folgt aus ...

https://github.com/Automattic/_s/blob/master/js/navigation.js

... aber ich kann einfach nicht die richtige Lösung zu finden scheinen. Jede Hilfe würde dankbar empfangen und gelernt von!

Answer 1

Ich empfehle nicht, die Datei navigation.js zu ändern, da dies eine Art von bereits existierendem Code ist, der nicht spezifisch für Ihre Site ist.

Was Sie tun können, ist zu versuchen, Ihr eigenes Skript in Ihrem Thema functions.php Datei Einreihen in etwa so:

function wpse39838169_addNoScroll() { ?> 
<script> 
$(".MENUBUTTONCLASS").on("click", function(e) { 
    $('body').addClass('noscroll'); 
}); 
</script> 
<?php } 
add_action('wp_enqueue_scripts','wpse39838169_addNoScroll'); 

Ersetzen „MENUBUTTONCLASS“ mit der Klasse der Schaltfläche, die angeklickt werden.

Answer 2

Danke Spartacus, du hast mich auf die richtige Spur gesetzt. Ich habe einige Tests und festgestellt, dass der folgende Code hinzugefügt/entfernt die ‚noscroll‘ Klasse auf den Körper, wenn die Schaltfläche geklickt wurde ...

jQuery(document).ready(function($){ 
    $(".menu-toggle").click(function() { 
     $('body').toggleClass('noscroll'); 
    }); 
}); 

... und ich die Warteschlange eingereiht, die den obigen Code in den Wordpress-Funktionen .php-Datei mit einer externen Javascript-Datei auf die übliche Weise.