Erreur sur script toggleHamburger

Résolu/Fermé
patricia@84 Messages postés 106 Date d'inscription vendredi 27 novembre 2015 Statut Membre Dernière intervention 24 septembre 2023 - 27 déc. 2022 à 12:15
patricia@84 Messages postés 106 Date d'inscription vendredi 27 novembre 2015 Statut Membre Dernière intervention 24 septembre 2023 - 27 déc. 2022 à 16:06

Bonjour,

Je n'ai jamais réussi à apprendre le javascript, mais il m'arrive d'utiliser des scripts html ou php dont je ne suis pas l'auteure, et qui comportent des scripts javascript pour leur fonctionnement.

Il en est un pour lequel mon logiciel Deamweaver m'indique une erreur de syntaxe, mais vu ma méconnaissance du javascript, je ne sais pas laquelle.

Voici le contenu du script toggleHamburger :

// Toggle Hamburger Icon
(() => {const ul = document.querySelector('.header-nav-lists');

const hamburger = document.querySelector('.header-hamburger-icon');

hamburger.addEventListener('click', () => {
ul.classList.toggle('show');
hamburger.classList.toggle('show');
})})()

Quelqu'un peut-il me dire quelle est cette erreur ?

Par avance, merci de votre aide.


Macintosh / Firefox 78.0

2 réponses

jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
27 déc. 2022 à 13:47

Bonjour,

Là comme ça je ne vois pas d'erreur...

Dans l'idéal, teste ta page dans un navigateur web et ouvre la console de developpeur de celui-ci ( touche F13, onglet console )

Regarde si il y a un message d'erreur... et donnes le nous.


0
patricia@84 Messages postés 106 Date d'inscription vendredi 27 novembre 2015 Statut Membre Dernière intervention 24 septembre 2023 9
27 déc. 2022 à 16:06

Bonjour,

Merci de m'avoir répondu.

Bien que je n'ai pas de touche F13 sur mon MacBook Pro, j'ai accédé à la console via Firefox. Celle-ci m'a indiqué : "Uncaught TypeError: $(...).datetimepicker is not a function" avec le nom du fichier "custom.js et le n° de la ligne concernée.

Il n'y a aucun lien entre le fichier "toggleHamburger.js" et le fichier "custom.js", mais cette erreur ne gênant pas le fonctionnement du fichier associé à "toggleHamburger.js", je ne vais plus vous embêter avec cette erreur de syntaxe.

Par contre, j'ai jeté un œil au fichier "customs.js", ce qui a résolu un autre problème (en général, je ne touche pas au contenu d'un fichier js puisque je n'y connais rien).

J'ai, sur le site sur lequel je travaille (un template que j'ai très largement modifié) , un script pour faire des réservations. Le fichier "bootstrap-datetimepicker.min.js" y est associé. Mais le problème est que le calendrier qui s'affiche est en anglais. J'ai donc remplacé le script réservation et son javascript par un autre sans javascript dont les dates sont en français.

Cependant, le fait d'avoir supprimé le fichier "bootstrap-datetimepicker.min.js",  devenu inutile, a interféré sur une galerie photos, et, plus précisément, sur la modale qui, au lieu d'afficher une image agrandie par dessus la galerie, la remplaçait totalement par ladite photo. Dès que j'ai remis ce fichier js et fait le lien dans le footer, ma modale a fonctionné correctement.

Ce que j'ignorais avant d'aller mettre mon nez dans le fichier "custom.js", c'est que celui-ci contenait non seulement des fonctions de "bootstrap-datetimepicker"

    $('select').niceSelect();
    $('#datetimepicker11,#datetimepicker1').datetimepicker({
        daysOfWeekDisabled: [0, 6]
    });

mais aussi de "simpleLightbox" qui est lié à la galerie...

    $('.imageGallery1 .light').simpleLightbox();

pourquoi cette incomptabilité entre eux deux, je ne sais pas, mais il m'a suffit de retirer les lignes concernant "bootstrap-datetimepicker" du fichier "custom.js" pour que tout rentre dans l'ordre. Plus besoin de "bootstrap-datetimepicker.js" pour que ma modale se comporte normalement.

Donc, problèmes actuels supprimés.

Bonne fin de journée.

Patricia

0