2

我的页面上有多个 HTML5 流播放器实例。当我开始播放一个，然后单击另一个，第一个不会停止。有没有办法配置它，以便一次只玩一个？

以下是测试页面的代码：

<html>
<head>
    <script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js">
    </script>

    <!-- 2. flowplayer -->
    <script type="text/javascript"
        src="//releases.flowplayer.org/5.4.1/flowplayer.min.js">
    </script>

    <!-- 3. skin -->
    <link rel="stylesheet" type="text/css"
        href="//releases.flowplayer.org/5.4.1/skin/minimalist.css">
    <title>title</title>
</head>
<body>
    <div>
        <div class="flowplayer">
            <video>
                <source type="video/mp4" src="PATH TO VIDEO 1">
            </video>
        </div>
    </div>
    <div>
        <div class="flowplayer">
            <video>
                <source type="video/mp4" src="PATH TO VIDEO 2">
            </video>
        </div>
    </div>
</body>
</html>
4

2 回答 2

3

好的。终于找到了！这是一个名为“Splash”的功能

从文档中：

Flowplayer 有一个称为“启动画面”的独特功能，它类似于海报设置，只是嵌套的 VIDEO 或 Flash OBJECT 标签最初不存在于页面上，而是按需插入。当用户单击初始屏幕时，播放器会即时安装。这有以下好处： 您可以在页面上拥有无限数量的播放器，并且它们 - 或者更确切地说是它们的初始屏幕 - 都立即呈现，即使在 Flash 模式下也是如此。没有隐藏的 Flash 对象会干扰您的脚本或 CSS 布局动态。一次只能播放一个视频。当用户在另一个播放器实例运行时单击启动屏幕时，后者会自动卸载。通过设计，启动设置还禁用视频的预加载。

https://flowplayer.org/docs/setup.html#splash

于 2013-05-10T14:08:38.837 回答
1

据我所知，flowplayer 中没有默认行为，只允许在页面上有多个实例时播放一个视频（无论是使用 Flash 播放器还是较新的 HTML5）。

您可以使用flowplayer api自己执行此操作。该 api 提供方法，例如play(),pause()和stop(). 在您的情况下，您可以绑定到click事件以停止所有其他实例。

例子

$('#bacon-player').bind("click", function(e, api)){
    // Add code here to stop other players.
    $('#other-player').stop();
};
于 2013-05-10T13:12:38.927 回答