0

我正在将 LightGallery 用于 youtube 视频。我正在尝试更改默认缩略图，但它不起作用。

在我看来：

<div class="video-gallery">
    <div id="lightgallery">

        <span class="video" data-src="https://www.youtube.com/watch?v=meBbDqAXago">
            <a href="">
                <img class="img-responsive" src="http://img.youtube.com/vi/meBbDqAXago/0.jpg" style="width: 100%;">
            </a>
        </span>
        <i data-src="https://www.youtube.com/watch?v=Pq9yPrLWMyU"></i>

    </div>
</div>

在javascript

$('#video-gallery').lightGallery({
    loadYoutubeThumbnail: true,
    youtubeThumbSize: 0,
});

我加载了以下脚本和css

{!! HTML::style('css/web/lightgallery.css') !!}
{!! HTML::style('css/web/lg-video.css') !!}

{!! HTML::script('js/web/lightgallery.min.js') !!}
{!! HTML::script('js/web/lg-thumbnail.min.js') !!}
{!! HTML::script('js/web/lg-fullscreen.min.js') !!}
{!! HTML::script('js/web/lg-video.min.js') !!}

假设 youtubeThumbSize 是选择要在图库中显示的缩略图。我尝试使用 0 或 2，但始终使用默认值 1。如何使用另一个缩略图？什么不对？

4

1 回答 1

0

解决了我添加了哈希插件，因为我需要在同一页面中创建多个视频画廊，并且以这种方式工作。这些是变化：

在视图中：

<div class="video-gallery">
<div id="hash1">

    <span class="video" data-src="https://www.youtube.com/watch?v=meBbDqAXago">
        <a href="">
            <img class="img-responsive" src="http://img.youtube.com/vi/meBbDqAXago/0.jpg" style="width: 100%;">
        </a>
    </span>
    <i data-src="https://www.youtube.com/watch?v=Pq9yPrLWMyU"></i>

</div>

在javascript中：

$("#hash1").lightGallery({
    hash: true,
    galleryId: 1,
    loadYoutubeThumbnail: true,
    youtubeThumbSize: 0,
});

我还添加了 LightGallery 的插件：

{!! HTML::script('js/web/lg-hash.min.js') !!}
于 2018-02-26T09:34:23.597 回答