Fluid Player 技术文档

Fluid Player 技术文档

fluid-player Fluid Player - an open source VAST compliant HTML5 video player 项目地址: https://gitcode.com/gh_mirrors/fl/fluid-player

1. 安装指南

Fluid Player 是一个轻量级的 HTML5 视频播放器，支持高级的 VAST 广告功能。你可以通过以下几种方式安装 Fluid Player：

通过 npm 安装

如果你使用的是 Node.js 环境，可以通过 npm 安装 Fluid Player：

npm install fluid-player

通过 CDN 引入

你也可以直接通过 CDN 引入 Fluid Player 的 JavaScript 文件：

<script src="https://cdn.jsdelivr.net/npm/fluid-player/dist/fluidplayer.min.js"></script>

下载源码

你还可以从 GitHub 下载 Fluid Player 的源码，并将其包含在你的项目中：

<script src="path/to/fluidplayer.min.js"></script>

2. 项目的使用说明

Fluid Player 的使用非常简单，只需在 HTML 中添加一个 <video> 标签，并初始化 Fluid Player 即可。

基本使用

<video id="video-player">
    <source src="path/to/video.mp4" type="video/mp4">
</video>

<script>
    var myFP = fluidPlayer(
        'video-player',
        {
            layoutControls: {
                controlBar: {
                    autoHide: true,
                    autoHideTimeout: 3,
                    animated: true
                }
            }
        }
    );
</script>

配置选项

Fluid Player 提供了丰富的配置选项，你可以根据需要自定义播放器的外观和行为。例如：

var myFP = fluidPlayer(
    'video-player',
    {
        layoutControls: {
            controlBar: {
                autoHide: true,
                autoHideTimeout: 3,
                animated: true
            },
            playPauseAnimation: true,
            fillToContainer: true,
            posterImage: 'path/to/poster.jpg'
        }
    }
);

3. 项目 API 使用文档

Fluid Player 提供了一些 API 方法，方便你在播放器初始化后进行操作。

播放视频

myFP.play();

暂停视频

myFP.pause();

获取当前播放时间

var currentTime = myFP.getCurrentTime();

设置播放时间

myFP.setCurrentTime(120); // 设置播放时间为 120 秒

获取视频总时长

var duration = myFP.getDuration();

4. 项目安装方式

Fluid Player 的安装方式主要有以下几种：

通过 npm 安装

npm install fluid-player

通过 CDN 引入

<script src="https://cdn.jsdelivr.net/npm/fluid-player/dist/fluidplayer.min.js"></script>

下载源码

从 GitHub 下载 Fluid Player 的源码，并将其包含在你的项目中：

<script src="path/to/fluidplayer.min.js"></script>

通过以上几种方式，你可以轻松地将 Fluid Player 集成到你的项目中，并开始使用这个功能强大的 HTML5 视频播放器。

fluid-player Fluid Player - an open source VAST compliant HTML5 video player 项目地址: https://gitcode.com/gh_mirrors/fl/fluid-player