lightgallery.js:628 Uncaught Error: Make sure that slide 0 has an image/video src

[starzou]

<!-- data-src should not be provided when you use html5 videos -->
<ul id="html5-videos">
  <li data-poster="video-poster1.jpg" data-sub-html="video caption1" data-html="#video1" >
      <img src="img/thumb1.jpg" />
  </li>
  <li data-poster="video-poster2.jpg" data-sub-html="video caption2" data-html="#video2" >
      <img src="img/thumb2.jpg" />
  </li>
</ul>

[starzou]

    Plugin.prototype.isVideo = function (src, index) {

        if (!src) {
            throw new Error("Make sure that slide " + index + " has an image/video src");
        }

data-src should not be provided when you use html5 videos.

So, There is a logic error here. @sachinchoolur

[denvist]

@starzou

You need to use selector: lightGallery(document.getElementById('html5-videos'), {selector: '.item'});

<!-- data-src should not be provided when you use html5 videos --> <ul id="html5-videos"> <li data-poster="video-poster1.jpg" data-sub-html="video caption1" data-html="#video1" > <img src="img/thumb1.jpg" class="item" /> </li> <li data-poster="video-poster2.jpg" data-sub-html="video caption2" data-html="#video2" > <img src="img/thumb2.jpg" class="item" /> </li> </ul>

There is documentation: html-markup

[anandmajethiaindia]

Do we have a solution for this?

[sachinchoolur]

Hey @anandmajethiaindia , Yes, you need to follow any of the HTML markup provided in the demo page- In case, if you are not able to solve the issue please provide a jsfiddle or codepen demo.I'll fix the issue and send you back

[dweber019]

@sachinchoolur Here a codepen with the issue https://codepen.io/anon/pen/qYMorx

Here a PR which is related https://github.com/sachinchoolur/lightgallery.js/pull/24

And in my opinion the issue https://github.com/sachinchoolur/lightgallery.js/issues/76 is correct.

What do you think?

[sachinchoolur]

Hey @dweber019, The issue has been fixed. Please use the latest version of lightgallery.js

Actually, the pr - https://github.com/sachinchoolur/lightgallery.js/pull/24 created the issue :(

[dweber019]

@sachinchoolur thanks that fixed the issue. I still have an issue. I changed this https://codepen.io/anon/pen/qYMorx to the simplest setup but still it doesn't work.

Edit: Fixed this above issue by including lg-video.js into my site.

[sachinchoolur]

Here is the working demo - https://codepen.io/sachinchoolur/pen/vjwmYd

[balukov]

There is works for me:

1. class = item

   <div id="lightgallery">
   <a class="item" href="/img/img.png">
   <img src="/img/img.png" />
   </a>
   </div>

2. selector: ".item"

   <script>
   $(document).ready(function() {
   $("#lightgallery").lightGallery({
     thumbnail: true,
     download: false,
     selector: ".item"
   });
   });
   </script>