Галерея изображений с использованием Magnific-popup всегда всплывает первой, а не той, которая выбрана при нажатии ⇐ Jquery

[Anonymous]

Я использую JQUERY и Magnific Popup в проекте django. Когда я нажимал на любое изображение в галерее, вместо выбранного изображения всегда появлялось первое изображение. Это мой текущий код:
Вот шаблон django




{% for image in images %}


{% thumbnail MEDIA_ROOT|add:"images/"|add:dir|add:"/"|add:image 300x300 crop="smart" as im %}






{{ dir }}



{% endfor %}

Вот JavaScript и великолепное всплывающее окно

$(document).ready(function() {
$(document).on('click', '.image-link',function(e) {
e.preventDefault();
$('.image-link').magnificPopup({
type: 'image',
closeOnContentClick: true,
closeBtnInside: true,
midClick: true,
mainClass: 'mfp-with-zoom mfp-img-mobile',
gallery: {
enabled: true,
navigateByImgClick: true,
preload: [0,1] // Will preload 0 - before current, and 1 after the current image
},
image: {
verticalFit: true,
},
zoom: {
enabled: true
},
callbacks: {
beforeOpen: function() {

}
},
}).magnificPopup('open');
});
});



Подробнее здесь: https://stackoverflow.com/questions/784 ... e-selected