2

ユーザーが再生ボタンで画像をクリックしたときに Brightcove プレーヤーを表示する次のコードがあります。

$(document).ready(function() {
    $('#performanceVideo').hide();
    $('#banner_text_wrap').click(function(e) {
        e.preventDefault();
        $('banner-image').hide().fadeOut(slow);
        $('#performanceVideo').show().fadeIn(slow).css({'float':'left','margin-top':'-251px'});
    });
});

ビデオが終了したときに画像をフェードインしたい。jQuery を使用してビデオ終了イベントにフックするにはどうすればよいですか? ドキュメントを読んで、コードに含める必要があると思いaddEventListenerますが、私は JavaScript の初心者なので、助けていただければ幸いです。

4

1 に答える 1

5

次の 2 つのパラメーターをプレーヤー スニペットに追加します。

<param name="includeAPI" value="true" />
<param name="templateLoadHandler" value="myTemplateLoaded" />

次に、スニペット パラメータの templateLoadHandler に指定した値と一致する JavaScript 関数を追加して、videoPlayers 終了イベントのイベント リスナーをセットアップします。

function myTemplateLoaded(experienceID){
  player = brightcove.api.getExperience(experienceID);
  modVP = player.getModule(brightcove.api.modules.APIModules.VIDEO_PLAYER);
  modVP.addEventListener(brightcove.api.events.MediaEvent.COMPLETE,onMediaComplete);
}

次に、complete イベントが発生したときにプレーヤーを非表示にします。

function onMediaComplete(evt){
  $('#performanceVideo').hide();
  $('banner-image').show().fadeIn(slow);
}
于 2012-07-24T20:00:38.337 に答える