Estoy utilizando la libreria Magnific Popup (que es para mostrar imagenes desde un un thumbnail con zoom, etc), la cuestion es que puedo implementarla bien, el problema esta que mis imagenes estan dentro de un modal, a la hora de usar la libreria, esta queda detras del modal asi:
Como puedo hacer para que el elemento quede adelante del modal o como puedo cerrar el modal al hacer click alguna imagen? (no es la opcion que mas deseo pero tocara)
Este es el codigo que estoy utilizando:
$('.zoom-gallery').magnificPopup({
delegate: 'a',
type: 'image',
closeOnContentClick: false,
closeBtnInside: false,
autoFocusLast: true,
mainClass: 'mfp-with-zoom mfp-img-mobile',
image: {
verticalFit: true,
titleSrc: function (item) {
return item.el.attr('title') + ' · <a class="image-source-link" href="' + item.el.attr('data-source') + '" target="_blank">image source</a>';
}
},
gallery: {
enabled: true
},
zoom: {
enabled: true,
duration: 300, // don't foget to change the duration also in CSS
opener: function (element) {
return element.find('img');
}
}
});