Implement lightGallery not working?

[conmen80]

I try implement lightGallery into lightSlider, but it doesn't expand when click on the image, what is the issue?

`<link rel="stylesheet" href="lightslider.css"/>
 <link rel="stylesheet" href="lightgallery.css"/>
 <script src=jquery.min.js"></script>
 <script src="lightslider.js"></script> 
 <script src="lightgallery.min.js"></script> 
 <script>
 $(document).ready(function() {
      $('#image-gallery').lightSlider({
    gallery:true,
    item:1,
    loop:true,
    thumbItem:9,
    slideMargin:0,
    enableDrag: false,
    currentPagerPosition:'left',
    onSliderLoad: function(el) {
        el.lightGallery({
           selector: '#imageGallery .lslide'
        });
    }
      });
 });
 </script>

 <div class="item">            
     <div class="clearfix" style="max-width:474px;">
         <ul id="image-gallery" class="gallery list-unstyled">
             <li data-thumb="img/thumb/cS-1.jpg" class="lslide"> 
                 <img src="img/cS-1.jpg" />
             </li>
             <li data-thumb="img/thumb/cS-2.jpg" class="lslide"> 
                 <img src="img/cS-2.jpg" />
             </li>
             <li data-thumb="img/thumb/cS-3.jpg" class="lslide"> 
                 <img src="img/cS-3.jpg" />
             </li>
             <li data-thumb="img/thumb/cS-4.jpg" class="lslide"> 
                 <img src="img/cS-4.jpg" />
             </li>
         </ul>
     </div>
 </div>`

[RonaldPK]

You have selector: '#imageGallery .lslide' , but your list's ID is image-gallery. Also, you don't need to add class="lslide"; the lightSlider will do that. So this is not an issue.

[yongwc2710]

Hi guys, I'm still facing the problem. can any one pleas provide a sample code ? Please find my code as below. Thanks

'

• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 
• 

</div>  
    <script src="https://cdn.jsdelivr.net/picturefill/2.3.1/picturefill.min.js"></script>
    <script src="../dist/js/lightgallery.js"></script>
    <script src="../dist/js/lightgallery.min.js"></script>
    <script src="../dist/js/lg-fullscreen.js"></script>
    <script src="../dist/js/lg-thumbnail.js"></script>
    <script src="../dist/js/lg-video.js"></script>
    <script src="../dist/js/lg-autoplay.js"></script>
    <script src="../dist/js/lg-zoom.js"></script>
    <script src="../dist/js/lg-hash.js"></script>
    <script src="../dist/js/lg-pager.js"></script>
    <script src="../lib/jquery.mousewheel.min.js"></script>

'

[Tiththa]

@yongwc2710 still found an answer?