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

[starzou]

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

[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

[dweber019]

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

Here a PR which is related #24

And in my opinion the issue #76 is correct.

What do you think?

[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

[sachinchoolur]

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

Actually, the pr - #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>