javascript - 华丽的弹出窗口，选择最后显示的图像

Question

我有一个缩略图列表，当单击其中一个缩略图时，它会在带有 Magnific 脚本弹出窗口的弹出窗口中显示图像。

单击缩略图时，我还会在刚刚单击的缩略图周围显示一个边框。这很简单:

function SelectPicture(picture_id) {
$("li").removeClass('add_border_image');
$("li#picture_"+picture_id).addClass('add_border_image');}

但是，当查看和浏览较大的图像时，我需要通过显示周围的边框来选择每个缩略图。这样当弹出窗口关闭时，用户可以看到哪张图片是他最后查看的图片。

我知道我可以像这样覆盖关闭按钮:

  callbacks: {
    open: function() {
      $.magnificPopup.instance.close = function() {
        $("li").removeClass('add_border_image');
        $("li#picture_156259").addClass('add_border_image');    
        $.magnificPopup.proto.close.call(this);
      };
    }
  },

但是如何将当前显示图片的id传给右边的缩略图，使其显示边框呢？在上面的回调中，一切都像预期的那样工作，但这里缩略图的 id 是硬编码的以供测试。

Answer 1

通过使用较大图像的索引并使用该索引将类添加到具有相同索引的相应缩略图，使其正常工作。