Magnific-Popup Gallery在一个标签中有两个图像标签

Question

我正在用Magnific-Popup做一个画廊，但为了加快我的网站，我在一个标签内部放置了两个不同的图像。一个用于大屏幕，另一个用于小屏幕。我用引导类隐藏了一个或另一个图像（hidden-lg hidden-md & hidden-sm hidden-xs）。

问题是，当我点击一个标签打开图片库时，Magnific-Popup尝试打开隐藏图片并返回“图片无法加载”。

<li> 
 
    <figure> 
 
    <div class="gallery-item"> 
 
     <a href="assets/upload/images/romantic/clem-onojeghuo-193397.jpg" title="" class="gallery-item"> 
 
     <img src="/assets/image-cache/romantic/clem-onojeghuo-193397.5ddf5942.jpg" alt="" class="hidden-lg hidden-md"> 
 
     <img src="/assets/image-cache/romantic/clem-onojeghuo-193397.36620614.jpg" alt="" class="hidden-sm hidden-xs"> 
 
     <div class="gallery-caption"> 
 
      <div class="centrize"> 
 
      <div class="v-center"><i class="hc-search"></i></div> 
 
      </div> 
 
     </div> 
 
     </a> 
 
    </div> 
 
    </figure> 
 
</li>

$('.gallery-item').magnificPopup({ 
 
    type: 'image', 
 
    gallery:{ 
 
    enabled:true 
 
    } 
 
});

Answer 1

这是我自己的错误，因为我已经两次在 “画廊项目” 级。一个在div标签上，另一个在标签上。