web-dev-qa-db-ja.com

で作業しているVimeo Froogaloop API Fiddle だがしかし WP

私はVimeoのFroogaloop APIを利用して、ユーザーが特定の要素をクリックしたときにビデオ埋め込みを一時停止するようにしています。 my Fiddle で完璧に動作しますが、私のWordpress環境では動作しません。

私が取り組んでいるサイトの簡易版を作成するために、 this thread からコードをいくつか取り出しました。

HTML

<div id="player1" class="col">
    <div class="vid">
        <iframe src="//player.vimeo.com/video/75817361?title=0&amp;byline=0&amp;portrait=0&api=1" width="100%" height="auto" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    </div>
</div>

<div id="player2" class="col">
    <div class="vid">
        <iframe src="//player.vimeo.com/video/7038107?title=0&amp;byline=0&amp;portrait=0&api=1" width="100%" height="auto" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    </div>
</div>

<a class="pause" onclick="pauseAll(); return false;" href="#">Pause</a>

jQuery

function pauseAll() {
$('iframe[src*="vimeo.com"]').each(function () {
    $f(this).api('pause');
});
}

私が言ったように、それは私のFiddleでは完全に動作しますが、私の WPベースのサイトでは動作しません WPで作業すると、頭がさらに傷つきます。

誰かが何かアイデアを持っていればそれは大きな助けになるでしょう。

jqueryapivimeo
1
Poisontonomes

投稿者： https://developer.vimeo.com/player/js-api#universal-event-spec

1ページに複数のプレーヤーを埋め込んで制御する場合、または当社のJS APIライブラリ（Froogaloop）を使用する場合は、各プレーヤーにiframe要素のIDと一致するplayer_idを指定する必要があります。

http://player.vimeo.com/video/VIDEO_ID?api=1&player_id=vimeoplayer

Src定義にplayer_idクエリパラメータを追加する必要があるかもしれません。

2
Eric Groft