2

私はいくつかの問題を抱えています。js で vimeo を制御できることを発見したので、vimeo ビデオの再生を開始する再生ボタンを作成しようとしています。

私が抱えている問題は、同じページに複数のビデオがあることです。example/playground ファイル (ここからhttp://player.vimeo.com/playground / https://github.com/vimeo/player-api/tree/master/javascript ) を取得し、使用していない機能を削除しました。必要ありませんが、再生ボタンを特定のビデオに接続する方法がわかりません。

これは私がこれまでに持っているものです

HTML:

<iframe id="player_1" src="http://player.vimeo.com/video/7100569?api=1&amp;player_id=player_1" width="540" height="304" frameborder="0"></iframe>
<div class="intro">
     <span class="hide">Play 1</span>
</div>
<iframe id="player_2" src="http://player.vimeo.com/video/7100569?api=1&amp;player_id=player_2" width="540" height="304" frameborder="0"></iframe>
<div class="intro">
    <span class="hide">Play 2</span>
</div>

JS:

            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);

                function setupSimpleButtons() {
                    var buttons = container.querySelector('div.intro'),
                        playBtn = buttons.querySelector('.hide');

                    // Call play when play button clicked
                    addEvent(playBtn, 'click', function() {
                        froogaloop.api('play');
                    }, false);



                }

                setupSimpleButtons();
            }
        })();

不要なコードがある場合は、削除するのを手伝ってください。どうもありがとう。

4

2 に答える 2

0

ready()関数はvimeoプレーヤーごとに1回呼び出されます。addEventボタンで接続されているオブジェクトを変更する必要があります。これを行うには、おそらくidボタン自体に属性を設定する必要があります。

于 2011-05-30T09:43:55.660 に答える
0

これをもっと簡単に行う方法を見つけました。ここで例を見ることができます: http://labs.funkhausdesign.com/examples/vimeo/froogaloop2-api-basics.html

于 2011-08-18T10:45:52.293 に答える