README

LazyLoad嵌入YouTube播放器 - 简单轻量级的插件 - 纯JavaScript

状态

查看预览

快速开始

有几种选项可供选择

下载最新版本。
克隆仓库： git clone https://github.com/the-muda-organization/youtube-lazyload.git
使用Composer安装：composer require the-muda-organization/youtube-lazyload

包含内容

在下载中，您将找到以下目录和文件，逻辑上分组常见资源，并提供编译和最小化版本。您会看到类似这样的内容

没有依赖项。不需要jQuery或其他插件。请参阅下面的安装指南和如何使用

yt-lazyload/
 │
 └─ dist/
    │
    ├── css/
    │   ├── yt-lazyload.css
    │   └── yt-lazyload.min.css
    │
    └── js/
        ├── yt-lazyload.js
        └── yt-lazyload.min.js

错误和功能请求

有错误或功能请求？在打开新问题之前，先搜索现有和已关闭的问题。如果您的問題或想法尚未得到解决，请打开新问题。

安装

下载并复制文件到您的项目
打开yt-lazyload.js
更改设置
- settings_thumb_base_url 到您缩略图所在的自定义URL。
最小化JavaScript并将其放置在yt-lazyload.min.js。
将CSS和JavaScript添加到您的项目中

    <link href="https://example.com/yt-lazyload/4.x.x/css/yt-lazyload.min.css" rel="stylesheet">
    <script src="https://example.com/yt-lazyload/4.x.x/js/yt-lazyload.min.js"></script>

注意：由于文件大小较小，我建议将CSS & JS内联添加！

    <style>...</style>
    <script>...</script>

如何使用

获取您的电影YouTube ID，例如：d4AmYBhGBfM
添加以下代码以嵌入视频

<div class="yt-lazyload" data-id="d4AmYBhGBfM" data-thumb="" data-logo="3"></div>

使用YouTube ID命名缩略图d4AmYBhGBfM.jpg - 要使用其他文件类型，请更改JavaScript中的设置
将缩略图放置在JavaScript中设置的文件夹中

功能

CSS类

常见问题解答

我能使用YouTube域名获取缩略图吗？
- 我不确定它是否在所有情况下都适用，但您可以尝试。您需要调整JavaScript。
- 更改settings_thumb_base_url = 'https://img.youtube.com/vi/';
- 更改this_content.style.setProperty('--yt-lazyload-img','url("' + settings_thumb_base_url + this_data_id + '/maxresdefault.jpg")');
我能否使用YouTube lazyload与其他框架（如Bootstrap）一起使用？
- 是的，您可以使用！与其他框架不应存在冲突。
我能否嵌入除YouTube之外的视频播放器？
- 请参阅我们针对Vimeo播放器的姊妹项目：https://github.com/the-muda-organization/vimeo-lazyload
它在移动设备上工作吗？
- 是的，但不完全。Lazyload按预期工作，但YouTube在iOS和Android上禁用了自动播放。更多信息：https://stackoverflow.com/questions/15090782/youtube-autoplay-not-working-on-mobile-devices-with-embedded-html5-player

版本控制

YouTube LazyLoad将尽可能遵循语义版本控制指南进行维护。发布将按以下格式编号：<major>.<minor>.<patch>

变更日志

有关最后发布的内容，请参阅详细的CHANGELOG。

团队

Jakub Muda

行为准则

如果你们表现好，我们也会表现得很好。更多详情请参阅我们的行为准则.md。

版权和许可证

代码在MIT 许可证下发布。

the-muda-organization / youtube-lazyload

维护者

详细信息