Uncaught Error: Syntax error, unrecognized expression: images/

Bonjour à tous,

J'ai besoin de votre aide car j'essaye d'intégrer le plugin Jquerry Fancyapp (un plugin de lightbox) à ma page et lorsque tout est bien intégré, une fois que je clique sur l'image qui est censée s’agrandir, rien ne se passe et ma console affiche :

Citation:

---

Uncaught Error: Syntax error, unrecognized expression: images/Affiche4.jpg
at Function.oe.error (jquery-3.3.1.min.js:2)
at oe.tokenize (jquery-3.3.1.min.js:2)
at oe.select (jquery-3.3.1.min.js:2)
at Function.oe [as find] (jquery-3.3.1.min.js:2)
at w.fn.init.find (jquery-3.3.1.min.js:2)
at new w.fn.init (jquery-3.3.1.min.js:2)
at w (jquery-3.3.1.min.js:2)
at HTMLAnchorElement.<anonymous> (main.js:87)
at HTMLAnchorElement.dispatch (jquery-3.3.1.min.js:2)
at HTMLAnchorElement.y.handle (jquery-3.3.1.min.js:2)
oe.error @ jquery-3.3.1.min.js:2
oe.tokenize @ jquery-3.3.1.min.js:2
oe.select @ jquery-3.3.1.min.js:2
oe @ jquery-3.3.1.min.js:2
find @ jquery-3.3.1.min.js:2
w.fn.init @ jquery-3.3.1.min.js:2
w @ jquery-3.3.1.min.js:2
(anonymous) @ main.js:87
dispatch @ jquery-3.3.1.min.js:2
y.handle @ jquery-3.3.1.min.js:2

---

Je ne comprend vraiment pas pourquoi car lorsque je le fais sur une autre page vide html, cela fonctionne bien mais lorsque je l'ajoute à cette page qui contient d'autres éléments, ça ne fonctionne plus.

Pour précision : sur cette page j'ai un script pour intégrer jquerry, un script pour intégrer le plugin fancyapp, un script pour intégrer le plugin owlcarousel et un script pour mon fichier js.

Voici la ligne concernée :

Code:

---

1 2 3

<a data-fancybox="gallery" href='images/Affiche4.jpg'> <img class="item-2" src="images/Affiche4.jpg"> </a>

---

Je vous remercie en avance pour toute aide que vous pourrez m'apporter ! :)

il faut 2 images: une petite et une grande, comme indiqué dans l'exemple sur la page principale :

Code:

---

<a data-fancybox="gallery" href="big_1.jpg"><img src="small_1.jpg"></a>

---

en anglais le mot big signifie Grand et small signifie petit.

soit en traduisant :

Code:

---

<a data-fancybox="gallery" href="GrandeImage_1.jpg"><img src="PetiteImage_1.jpg"></a>

---

et en général dans la partie html on met des doubles cotes pas des simples quottes

Bonjour,

J'ai corrigé les deux points dont tu m'as parlé mais rien ne change, j'ai toujours le même problème... Je ne comprend pas d'où cela peut venir, j'ai cherché partout sur internet je n'ai pas trouvé de solutions

Je viens de trouver en partie la solution à mon problème !

L'erreur venait d'une fonction sur mon fichier js qui me permettait de faire une animation de scroll lorsque je cliquais sur une ancre. Maintenant que je l'ai supprimé, la light box fonctionne parfaitement.

Le problème vient du fait que mon ancre utilise aussi une balise a et un href et que la fonction associée pour l'animation de l'ancre est écrite comme suit :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

$(document).ready(function(){ // au clic sur un lien $('a').on('click', function(evt){ // bloquer le comportement par défaut: on ne rechargera pas la page evt.preventDefault(); // enregistre la valeur de l'attribut href dans la variable target var target = $(this).attr('href'); /* le sélecteur $(html, body) permet de corriger un bug sur chrome   et safari (webkit) */ $('html, body') // on arrête toutes les animations en cours .stop() /* on fait maintenant l'animation vers le haut (scrollTop) vers   notre ancre target */ .animate({scrollTop: $(target).offset().top}, 1000 ); }); });

---

Il y a donc un conflit entre mon ancre :

Code:

---

<div id="ancre"><a href="#ancre-destination" id="bouton1">JE VEUX PARTICIPER</a></div>

---

Et mon lien pour le light box :

Code:

---

<a data-fancybox="gallery" href="images/Affiche4.jpg"><img class="item-2" src="images/Affiche4.jpg"></a>

---

lorsque j'essaye de les faire fonctionner en meme temps. Quelqu'un aurait une idée? :)

C'est bon, j'ai réussi. Il fallait remplacer le 'a' par mon id associé à l'ancre.

Merci :)