Magnific Popup链接格式

Question

所以....这是我的问题。似乎巨大的弹出窗口不起作用，但我的库已正确添加，我的控制台没有显示任何错误。所以我通过删除链接中的一些标记来解决这个问题。 我有这个不起作用的HTML标记：

<a class="image-link" href="img/gallery1.jpg"> 
  <img class="img-responsive" src="img/gallery1.jpg" alt="">
  <span class="zoom"></span>
</a>

这是我对灯箱的简单脚本：

<script type="text/javascript">

  $(document).ready(function() {
    $('.image-link').magnificPopup({type:'image'});
  });
</script>

但如果我删除了跨度，灯箱会正确触发。我有这个跨度因为它是一个带有一些悬停效果的图标在css中。我想让这个插件与它一起工作。请帮助我，不要假设太多。我不了解javascript / jquery编程。