当前位置: 代码迷 >> JavaScript >> 宏伟的弹出窗口-忽略图库中的图像
  详细解决方案

宏伟的弹出窗口-忽略图库中的图像

热度:88   发布时间:2023-06-13 12:12:22.0

我正在使用Slick Slider和Magnific的组合。

光滑的滑块无限循环,包含多个图像,整个滑块是一个Magnific画廊。

Slick克隆元素以创建无限循环效果,并将类“ slick-cloned”添加到克隆的元素中,我需要从Magnific库中忽略这些克隆的元素。

我正在努力寻找有关动态忽略图库中元素的任何文档。 有人有想法么?

我尝试使用如下所示的委托,但这根本没有任何意义。

$('.container').magnificPopup({
   delegate: '.module:not(.slick-cloned) .gal-test',
   type:'image'
});

我的HTML结构

<div class='container'>
<div class='slider-wrap'>
    <div class='slick-slider'>
        <div class='module'><a href='image.jpg' class='gallery gal-test'><img src='' /></a></div>
        <div class='module'><a href='image.jpg' class='gallery gal-test'><img src='' /></a></div>
    </div>
</div>
</div>

谢谢院长

关闭光滑的转盘中的无限滚动将阻止此操作,因为这是在进行克隆。

关闭无限滚动作为快速解决方案。

真正的问题是由遍历每个画廊并将“容器”重新分配给宏伟的弹出窗口而引起的。 解决方案是在每个模块周围创建另一个级别的容器。

  相关解决方案