光滑的旋轉木馬和光滑的燈箱上相同的元素

Question

我有一個滑塊，我使用光滑的旋轉木馬，然後我需要這些圖像上的燈箱光滑的燈箱。

我的代碼：

<ul class="gallery-slider"> 
    <?php foreach($gallery as $image) : ?> 
    <li> 
     <a href="image-url-here"> 
     <img src="image-url-here"> 
     </a>       
    </li> 
    <?php endforeach; ?> 
</ul> 

$('.gallery-slider').slick({ 
     slidesToShow: 6, 
     slidesToScroll: 1, 
     arrows: true, 
     dots: false, 
     responsive: [ 
      { 
       breakpoint: 1000, 
       settings: { 
        slidesToScroll: 1, 
        slidesToShow: 4, 
        arrows: false 
       } 
      }, 
      { 
       breakpoint: 700, 
       settings: { 
        slidesToScroll: 1, 
        slidesToShow: 2, 
        autoplay: true, 
        autoplaySpeed: 3000, 
        arrows: false 
       } 
      } 
      // You can unslick at a given breakpoint now by adding: 
      // settings: "unslick" 
      // instead of a settings object 
     ] 
    }); 

$('.gallery-slider').slickLightbox({ 
     itemSelector: '> li > a' 
    }); 

當我點擊一個圖像，它只是打開一個新標籤的圖像，而不是使用燈箱。

Answer 1

我自己解決了這個問題，所以添加了一個答案。

這是因爲當初始化slick時，它會爲標記添加額外的div。

所以我需要做slickLightbox()選擇深一點，如：

$('.gallery-slider').slickLightbox({ 
    itemSelector: '> div > div > div > a' 
});