3

複数のビデオでVimeoAPIを使用するのに問題があります。私が使用しているコードは一時停止します

<audio id="audio-player" autoplay="autoplay" loop>
<source src="music/peanutbutter.mp3" type="audio/mpeg">
</audio>

再生からですが、最初のビデオiframeでのみ機能しています。2番目、3番目、または4番目のvimeo iframeの[再生]ボタンをクリックしても、残念ながらページの音声が一時停止していません。これはおそらく簡単な修正ですが、私はこれを理解しようと夢中になっています。ありがとう!

<script src="http://a.vimeocdn.com/js/froogaloop2.min.js"></script> 

<script type="text/javascript">
$(function(){

var vimeoPlayer = document.querySelector('iframe');

$f(vimeoPlayer).addEvent('ready', ready);

function ready(player_id) {

    froogaloop = $f(player_id);

    function setupEventListeners() {
        function onPlay() {
            froogaloop.addEvent('play',
            function(){
                $("#audio-player")[0].pause();
                $("#header-button-sound-play").hide();
                $("#header-button-sound-pause").show();
            });
        }

        onPlay();

    }
    setupEventListeners();
}

}) 
</script>

<div id="dwf-trailer" class="content"><iframe id="player_1" src="http://player.vimeo.com/video/35740045?api=1&player_id=player_1" width="745" height="393" frameborder="0"></iframe></div>

<div id="inkpaper-watch" class="content"><iframe id="player_2" src="http://player.vimeo.com/video/33359230?api=1&player_id=player_2" width="745" height="393" frameborder="0"></iframe></div>

<div id="ramon-watch" class="content"><iframe id="player_3" src="http://player.vimeo.com/video/44427351?api=1&player_id=player_3" width="745" height="393" frameborder="0"></iframe></div>

<div id="thatsunday-watch" class="content"><iframe id="player_4" src="http://player.vimeo.com/video/46602515?api=1&player_id=player_4" width="745" height="393" frameborder="0"></iframe></div>
4

1 に答える 1

2

どうでも!理解した。

このコードを置き換える

$f(vimeoPlayer).addEvent('ready', ready);

これとともに

jQuery('iframe').each(function(){
            Froogaloop(this).addEvent('ready', ready);
});

問題を修正しました!したがって、動作するJavaScriptコードは

<script type="text/javascript">
$(function(){

jQuery('iframe').each(function(){
            Froogaloop(this).addEvent('ready', ready);
});

function ready(player_id) {

    froogaloop = $f(player_id);

    function setupEventListeners() {
        function onPlay() {
            froogaloop.addEvent('play',
            function(){
                $("#audio-player")[0].pause();
                $("#header-button-sound-play").hide();
                $("#header-button-sound-pause").show();
            });
        }

        onPlay();

    }
    setupEventListeners();
}

}) 
</script> 

http://labs.funkhausdesign.com/examples/vimeo/froogaloop2-api-basics.htmlに感謝します

助けて!

于 2013-03-14T20:36:17.007 に答える