0

ページごとに異なるスライドを使用して、アンカーポイントとJqueryに基づいてサイトを構築しています(すべてうまく機能しています。背景を説明したいと思います)

さて、これが問題です。スライドのうち 3 枚には、別の場所に移動すると自動的に停止する必要がある Youtube ビデオがあります。だから私は次の文字列を付けて「戻る」ボタンに書きました

onclick="player.stopVideo(); return false"

今私が抱えている問題は、Youtube API が自動的にプレーヤーにクラスではなく「プレーヤー」の ID を与えることです。API の後にこのコード行が呼び出されます。

<script>
var player;
function onYouTubePlayerAPIReady() {player = new YT.Player('player');} 
</script>

そして、このようなiframe

<iframe id="player" src="http://www.youtube.com/embed/TMFINFk_080?&vq=hd720" frameborder="0" allowfullscreen></iframe>

期待通り、完璧に動作します。同じページに停止線を適用する必要がある複数のビデオがあり、完全に失われているため、クラスとしてこれが必要です。友人は、停止コマンドをクラス名で呼び出す関数を定義することを提案しましたが、どこから始めればよいかわかりません。

ありがとう。

注:このページにはすでに多くのコードがあり、埋め込みを追加するとより多くのスペースが必要になるため、iframeが理想的ですが、これにあまりこだわることはありませんが、iframeが提供するサポートは理想的です

4

1 に答える 1

0

`

<!DOCTYPE html>
<html lang="es">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>   
<script type="text/javascript" src="http://www.youtube.com/player_api"></script>
<script>
var player;
function onYouTubeIframeAPIReady() {player = new YT.Player('player');}
if(window.opera){
    addEventListener('load', onYouTubeIframeAPIReady, false);
}
</script>
 </head>
<body>
<script>
$(document).ready(function(){
 });
</script>
<div id="video">
  <iframe id="player" width="560" height="349" frameborder="0" src="http://www.youtube.com/embed/vE_0V55Vywc?rel=0&wmode=Opaque&enablejsapi=1"></iframe>
</div>
<a href="javascript: void(0)" onclick="player.playVideo(); return false">play</a><br>
<a href="javascript: void(0)" onclick="player.stopVideo(); return false">stop</a>
</body>
</html>

`例: http://jsfiddle.net/ckWLs/1/

于 2014-01-02T01:09:46.293 に答える