I'm using a combination of Slick Slider and Magnific.
The slick slider is on an infinite loop and contains multiple images, the slider as a whole is one Magnific gallery.
Slick clones elements to create the infinite loop effect and adds the class "slick-cloned" to the cloned elements, I need to ignore these cloned elements from my Magnific gallery.
I'm struggling to find any documentation on dynamically ignoring elements from a gallery though. Any one have any ideas?
I've tried using a delegate as shown below but this just doesn't pick anything up at all.
$('.container').magnificPopup({
delegate: '.module:not(.slick-cloned) .gal-test',
type:'image'
});
My HTML structure
<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>
Thanks, Dean
关闭光滑的转盘中的无限滚动将阻止此操作,因为这是在进行克隆。
Turned off infinite scroll as a quick fix.
Real problem was caused by looping through each gallery and reassigning the "container" to magnific pop-up. Solution would be to create another level container around each module.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.