隐藏视频 vimeo 上的 froogaloop 事件答案

【问题标题】：froogaloop events on hidden video vimeo隐藏视频 vimeo 上的 froogaloop 事件
【发布时间】：2014-07-21 15:37:44
【问题描述】：

我正在尝试从我使用 froogaloop 动态添加的一个或多个 vimeo 播放器中捕捉暂停和播放事件。

玩家最初是隐藏的，但我仍然想将事件附加到玩家。

我做了一个 js fiddle 来说明我的问题。当 mydiv 有 style:display:none 时，事件 ready 不会触发。

http://jsfiddle.net/jonasvermeulen/c3dqU/2/

这是我的html：

<div id="mydiv" style="display:none"></div>

这是我的 jquery

$('#mydiv').append('<iframe id="player1" src="http://player.vimeo.com/video/27855315?api=1&player_id=player1" width="400" height="225" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>');
var iframe = $('#player1')[0];
var player = $f(iframe);

// When the player is ready, add listeners for pause, finish, and playProgress
player.addEvent('ready', function() {
   alert("ready");

    player.addEvent('pause', onPause);
    player.addEvent('finish', onFinish);
    player.addEvent('playProgress', onPlayProgress);
});

function onPause(id) {
    alert('paused');
}

function onFinish(id) {
    alert('finished');
}

function onPlayProgress(data, id) {
    alert(data.seconds + 's played');
}

当你移除显示器时：没有它的工作。

有解决办法吗？

【问题讨论】：

带有display:none 的元素在许多方面表现得好像它们甚至不是DOM 的一部分。只需使用另一种隐藏元素的方法——visbility，绝对定位在屏幕外，……
@cBroe ，这确实是正确的答案，现在我在删除 display none 并且播放器可见时绑定事件。感谢您的帮助
好的，作为答案添加。

标签： jquery vimeo froogaloop

【解决方案1】：

带有display:none 的元素在许多方面表现得好像它们甚至不是DOM 的一部分。

（只需尝试使用另一种隐藏元素的方法——visibility，绝对定位在屏幕外……）

……或者如你所说，在玩家不再隐藏时绑定事件。

【讨论】：