3

vimeoプレーヤーAPIに問題があります。iframeを使用してページにVimeoビデオを埋め込み、このiframe上に画像を配置します。画像には再生ボタンがあります。この画像をクリックすると画像がフェードアウトし、次のコマンドを使用してビデオを再生します。

froogaloop.api('play');

これは、ビデオの再生中にビデオが読み込まれるため、再生が少し厄介であるという事実を除いて、うまく機能します。ユーザーが再生ボタンで画像をクリックしたときにビデオが(完全にまたは部分的に)ロードされるように、ページのロード時にビデオのロードを開始したいと思います。私はこれを呼び出してみました:

froogaloop.api('play');
froogaloop.api('pause');

ページの読み込み時に順次(以下を参照)。最初に再生を呼び出してから一時停止すると、一時停止中に動画が強制的に読み込まれます。重要なのは、playコマンドの直後のpauseコマンドがどういうわけか無視されるということです。つまり、ビデオはページの読み込み時に再生されているだけです。

誰かがこれを経験したことがありますか、ビデオをプリロードする方法はありますか?

    //INIT Vimeo API
var vimeoPlayers = document.querySelectorAll('iframe'),
    player;

for (var i = 0, length = vimeoPlayers.length; i < length; i++) {
    player = vimeoPlayers[i];
    $f(player).addEvent('ready', ready);
}

function addEvent(element, eventName, callback) {
    if (element.addEventListener) {
        element.addEventListener(eventName, callback, false);
    } else {
        element.attachEvent(eventName, callback, false);
    }
}

function ready(player_id) {
    // Keep a reference to Froogaloop for this player
    var container = document.getElementById(player_id).parentNode.parentNode, 
        froogaloop = $f(player_id);

    //Call Play and pause to activate loading of whole video
    //Vimeo won't let you preload the video by default (because of bandwidth issues etc.)
    froogaloop.api('play');
    froogaloop.api('pause');

    $('#media-home a').click(function(){

        $(this).fadeOut('12000');
        froogaloop.api('play');

        return false;   

    });                

}
4

3 に答える 3

2

再生と一時停止を順番に呼び出すと、ほとんどのプラットフォームでオーバーラップし、一時停止が無視されます。確実に動作させるには、次のように、イベント ハンドラーをバインドしてイベントを再生し、そこで一時停止を呼び出す必要があります。

    Froogaloop(playerID).addEvent('play', function(playerID) {
        Froogaloop(playerID).api('pause');
        Froogaloop(playerID).removeEvent('play');
    });
    Froogaloop(playerID).api('play');

イベント ハンドラーは、ユーザーが実際に再生をクリックしたときに実行されないように、それ自体をアンバインドする必要があることに注意してください。

于 2012-07-23T13:46:02.293 に答える