froogaloop события на скрытом видео vimeo

Question

Я пытаюсь поймать паузу и сыграть события от одного или нескольких игроков vimeo, которые я добавил динамически с помощью froogaloop.

Игроки изначально скрыты, но все же я хочу присоединить события к игроку.

Я сделал скрипт js, который иллюстрирует мою проблему. когда mydiv имеет стиль: display: none, событие готово не срабатывает.

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'); 
} 

При удалении дисплея: никто не работает.

Есть ли обходной путь для этого?

Answer 1

Элементы с display:none ведут себя так, как если бы они не были частью DOM во многих аспектах.

(Просто попробуйте и использовать другой метод сокрытия элементов - visibility, абсолютно расположенный вне экрана, ...)

... или, как вы сказали, связать события, когда игроки не скрыты больше.