search

thdoan / magnify

A lightweight jQuery magnifying glass zoom plugin.
https://thdoan.github.io/magnify/
MIT License
243 stars 63 forks source link

Integrate Magnify with magnic-popup js #68

Closed latrille-bot closed 3 years ago

latrille-bot commented 3 years ago

Hello,

Thank you for your great work. Magnify works fine in my example html page here https://www.bibelotandco.fr/armoire-vitrine-en-teck-birman-ancien-18795 but I would like to integrate it into the popup which is opened with the js magnific-popup. I added the elements in the js which gives me the following html (with class zoom and data-magnify-src property:

<figure><img class="zoom mfp-img" alt="Armoire vitrine en teck birman ancien" src="https://www.bibelotandco.fr/uploads/images/img_1920x_6093ee002405b7-85422306-73716813.jpg" data-magnify-src="https://www.bibelotandco.fr/uploads/images/18795-0.jpg" style="max-height: 370px;"><figcaption><div class="mfp-bottom-bar"><div class="mfp-title"></div><div class="mfp-counter">4 of 12</div></div></figcaption></figure>

but magnify does not fire in the popup. Can you help me ? Thank you so much !

latrille-bot commented 3 years ago

can be the same error but when one arrives on the page, the magnifying glass is displayed well on the main photo but does not appear any more if one chooses another photo thumbnail, problem of reloading?

latrille-bot commented 3 years ago

thank you, finally solved by adding

$('.zoom').magnify();

in the $.magnificPopup.registerModule('gallery' function