Ajout de la classe noscroll au corps dans le menu cliquez sur

Question

J'utilise des underscores comme thème de départ pour Wordpress, et je voudrais ajouter une classe 'noscroll' à l'élément body quand le bouton de menu est ouvert, puis le retirer encore une fois lorsque le menu est fermé.

J'ai essayé d'ajouter ce genre de chose ...

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

... au fichier navigation.js existant qui vient avec underscores. Ce qui ressemble à ceci ...

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

... mais je ne arrive pas à trouver la bonne solution. Toute aide serait reçue et apprise avec gratitude!

Answer 1

Je ne recommande pas de modifier le fichier navigation.js car il s'agit d'un type de code préexistant qui n'est pas spécifique à votre site.

Ce que vous pouvez faire est d'essayer enqueueing votre script personnalisé dans votre fichier thème functions.php comme ceci:

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

Remplacer « MENUBUTTONCLASS » avec la classe du bouton qui sera cliqué.

Answer 2

Merci Spartacus, vous m'avez mis sur la bonne voie. Je l'ai fait quelques tests et a constaté que le code suivant ajouté/supprimé la classe « noscroll » au corps lorsque le bouton a été cliqué ...

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

... et je le code en file d'attente ci-dessus dans les fonctions Wordpress Fichier .php en utilisant un fichier javascript externe de la manière normale.