2

YouTube iframe JavaScript API を使用していますが、ios7 で動画が再生されません。YouTube独自のスタイルシートによって隠されているiframe内に再生ボタンがあることに気付きました(または、高さと幅が1pxに設定されています!重要)。ios7 シミュレーターで safari のデバッガーを使用してこれらのスタイルを削除すると、再生ボタンが表示され、クリックすると、ios でビデオを再生できます。

問題は、この動作をオーバーライドするスタイルをスタイルシートに記述できないことです! この問題を解決するにはどうすればよいですか? 問題のあるスタイルのスクリーンショットが添付されています。以下は、プレーヤーを開始するための私のコードです。

var videoOptions = {
        'controls': 0,
        'playsinline' : 1,
        'showinfo': 0,
        'html5':1,
        'modestbranding': 1,
        'autoplay': 0,
        'rel': 0,
        'enablejsapi' : 1,
        //'origin': window.location.origin,
        'wmode': 'opaque'
      };
      $scope.jsPlayer = new YT.Player('story-video-player-container', {
        height: '100%',
        width: '100%',

        videoId: $scope.currentVideo.youtube_id,
        events: {
              'onReady': $scope.onPlayerReady,
              'onStateChange': $scope.onPlayerStateChange,
              'onPlaybackQualityChange': $scope.onPlaybackQualityChange
        },
        playerVars: videoOptions,
      });

すべての videoOptions を変更して、すべてのコントロール/情報/ブランディングなどを表示しようとしましたが、何も機能しません。

ここに画像の説明を入力

4

1 に答える 1

2

これは既知の問題であり、Google は「修正済み」と言っていますが、他の開発者 (私たち自身を含む) はそうではないと主張しています。私はそこであなたの質問を参照しました。あなたはこれに従いたいと思うかもしれませんが、報告し、議論にあなた自身の声を加えてください.

この時点で、これは html5-video-container 内のビデオ タグのサイズを 1px に設定するため、YouTube 側で完全に制御されているように見えます。

私たちの場合、iframe をページに埋め込んでから、javascript を実行して非表示の div 要素を表示して動画を表示し、YouTube API の再生イベントをトリガーして動画を再生するボタンを設定します (例: http:/ /www.3708colet.com )。

しかし、Google は、これは「自動再生」と同じであり、iOS によって無効にされていると述べています (Android Chrome でも明らかに無効になっています。私たちのテストでは、そこでも壊れています)。再生する代わりに、少なくとも iOS では、iframe があるコンテナーの左上隅に 1 ピクセルの白い正方形が表示されます。それをクリックすると、ビデオとの「インタラクション」がトリガーされ、ビデオがロードされます (Android では機能しません)。したがって、エラーはありませんが、YouTube のページでは、iframe 領域を埋めるのに十分な大きさのビデオが作成されません。

于 2014-05-19T23:31:26.210 に答える