Question

我正在开发一个包含两个相同vimeo视频的网站。一个用于＆lt;屏幕分辨率较大的屏幕分辨率。 1000px分辨率我希望视频在另一个地方。所以我把它们中的两个放在那里，用一些CSS我控制哪一个是可见的..

但是，视频需要在页面加载时获得自动播放功能。在display:none; css标记时，它只会隐藏视频而不会暂停/停用视频。

有控制它的好方法吗？目前我正在尝试使用jQuery和Froogaloops，但还没有能够让它工作。这是我到目前为止所得到的：

    jQuery(document).ready(function($) {

    var player = $("#82625501");
    froogaloop = $f(player[0].id);
    // Optimalisation: Store the references outside the event handler:
    var $window = $(window);

    function checkWidth() {
        var windowsize = $window.width();
        if (windowsize < 1000) {

             froogaloop.api('pause');

        }
        else {
             froogaloop.api('play');
        }
    }
    // Execute on load
    checkWidth();
    // Bind event listener
    $(window).resize(checkWidth);
});

仅当您调整屏幕大小而不是首次加载时才有效。这该怎么做？或者也许有一种更简单的方法？提前谢谢！

Answer 1

好的，您可能要做的就是将Vimeo's embed API上列出的自动播放参数更改为'1'，如下所示：

<iframe src="//player.vimeo.com/video/82527075?autoplay=1" width="500" height="209" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe> <p><a href="http://vimeo.com/82527075">The Awareness</a> from <a href="http://vimeo.com/user2354244">Henry</a> on <a href="https://vimeo.com">Vimeo</a>.</p>

其中?autoplay=1附加到src网址的是触发自动播放的内容，但这对于大多数移动设备而言并不适用于与数据消费有关的最佳做法。

您可以手动添加或从Vimeo获取嵌入代码时，只需打开show options菜单并选择自动播放即可自动附加。

至于禁用视频，至少在我的Firefox测试中，一旦视频在断点之前设置为display: none;，它就会从音频剪切开始自行停止播放。

好吧，如果您想要在视频不可见时停下来，我猜this question有助于解决问题。

停止在特定分辨率上播放嵌入视频

1 个答案: