0

サイトにガーニッシュテーマを使用していますが、訪問者がFolio内のアイテムをクリックすると、投稿のコンテンツが読み込まれます。投稿はvimeoからの1つ以上のビデオで構成されており、次のようにiframe経由で呼び出されます。

<iframe id="player_0" src="http://player.vimeo.com/video/57038297?title=0&amp;byline=0&amp;portrait=0&amp;color=FF9A00&amp;api=1&amp;player_id=player_0" frameborder="0" width="632" height="356" webkitallowfullscreen="" mozallowfullscreen="" allowfullscreen=""></iframe>

私はすでにvimeoのfroogaloopを使用して、外部リンクからビデオを停止/アンロードしました（これは非常に基本的なテストです）。コントロールのコードは次のとおりです。

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) {
    var container = document.getElementById(player_id),
        froogaloop = $f(player_id);
    $("a.stopvid").on('live', function(){ froogaloop.api('unload'); });
}

しかし、今回は、ajax呼び出しの後にビデオが読み込まれるため、APIを使用することができないようです。

上記のコードをに含めようとしました$(document).ajaxComplete(function(event, xhr, settings) { ... });が、うまくいきませんでした。

これを確認するためのテストサイトです。メニューのポートフォリオリンクをクリックし、最初の項目をクリックします。コンテンツが読み込まれ、右上隅に小さな十字が表示されます。これにより、動画が停止しますが、停止しません。

助けていただければ幸いです、私はかなり迷っています。

4

1 に答える 1

0

最初に行うことは、ページにjavascriptエラーがないかどうかを確認することです。
iframeセレクターは汎用的なものであり、Facebookなどの他の「プラグイン」で使用される他のiframeをキャッチする場合があります。

動作するには、froogaloopready関数にiframe上のIDが必要です。iframeにIDがない場合、readyイベントは何も受信せず、player_idは未定義になります。

JQueryを使用しているため、スクリプトの最初の行を次のように変更します。 

var vimeoPlayers = $("iframe#player_0"), player;

この行を使用すると、必要なiframeのみを選択することができます。

于 2013-02-07T00:59:16.900 に答える