2011-07-08 43 views
1

ChromeのSafariではうまく動作しますが、iPad/iPhoneではうまく動作していないビデオタグがあります。私は間違っています。html5 iPadで再生していないビデオ

<a onclick="showVideoPlayer('http://www.mywebsite.com/videos/a video file.m4v')" id="video1" href="#">Play video</a> 

jsのコード

function showVideoPlayer(videoSrc, showDownloadLink){ 
      alert(videoSrc); 
      if(!videoSrc) 
       return; 

      $('div#overlay').show(); 
      var $videoPlaceHolder = $('div#video-placeholder'); 
      $videoPlaceHolder.show(); 

      var $video = $videoPlaceHolder.find('video'); 

      var winWidth = $(window).width() - 80; 
      var winHeight = $(window).height() - 120; 

      $video.attr('src', videoSrc); 
      $video.attr('width', winWidth + 'px'); 
      $video.attr('height', winHeight + 'px'); 
      $videoPlaceHolder.append($video); 
      if(showDownloadLink){ 
       $('#video-placeholder .down').show(); 
      } 

     } 
+0

#ビデオプレースホルダのマークアップを教えてください。 – betamax

答えて

0

のiOSは、動画を再生に関する追加-うるさいことで有名です。

  1. ビデオはH.264ベースラインプロファイルを使用してエンコード(他のプロファイルは、iOSの下で場に保証するものではありません)
  2. 適切なContent-Typeヘッダでサービスされている動画ファイル(binary/octet-stream意志:ここをチェックするためにいくつかのことです
  3. <video />内に<source type="foo" src="bar" />タグを使用すると、type属性の値がサーバーから提供されたcontent-typeヘッダーと正確に一致することを確認してください。これは大文字と小文字が区別されます。
  4. ビデオファイルを配信するサーバーは、バイト範囲のリクエストをサポートしている必要があります.iOS Safariの開発者コンソールでは、これらの行に苦情が表示されるはずです。

これは私が遭遇した最も一般的なエラーです(私はオンラインビデオプラットフォームで働いています)。うまくいけば、あなたの欠点は欠けている要件を見つけることと同じくらい簡単です。

関連する問題