Jquery 停止播放特定分辨率的嵌入式视频

我在一个网站上工作，该网站包含两个相同的vimeo视频。一个是大屏幕分辨率，分辨率<1000px，我想把视频放在另一个地方。所以我把其中的两个放在那里，用一些CSS控制哪一个是可见的

但是，视频需要在页面加载时自动播放。而显示：无；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);
});

---

这仅在调整屏幕大小时有效，而不是在首次加载时。如何做到这一点？或者有更简单的方法？提前谢谢

好的，那么您可能要做的是将上概述的autoplay参数更改为“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 url后，将触发自动播放，尽管这对于大多数移动设备不起作用，因为这是关于数据消耗的最佳实践

您可以手动添加，或者在从Vimeo获取嵌入代码时，只需打开ShowOptions菜单并选择autoplay自动添加

至于禁用视频，至少在我的Firefox测试中，一旦视频设置为显示：无；过了断点后，从音频中断判断，它停止了自己的播放

---

嗯，我想这有助于解决当视频不可见时您是否需要硬停的问题。

您使用的是哪种类型的播放器？它应该具有预定义的属性以启用自动播放。至于显示器，在做类似的事情时，我使用媒体查询来隐藏/显示我想要的不同大小的显示器。@我正在嵌入一个vimeo视频，所以vimeo播放器？谢谢你的回答，但实际上你没有给我答案。我知道如何播放和隐藏视频，这不是我的问题。你提供的链接可能很有用。