iOS上でのjQueryモバイルの問題、ムービーを表示するとき

Question

jquery mobileを使用してモバイルサイトを開発しています.iOSなしのすべてのプラットフォームで動作します。私はjqueryのモバイルスクリプトを削除しようとした後、ビデオが読み込まれますが、ページの残りの部分は残念です。それはmp4映画です。

バージョンjquery-mobile-1.0とvideo-jsを使用しています。

誰も同じ問題がありますか？

<div class="vjs-container"> 
<div class="videoWidth video-js-box test-css vjs-controls-below vjs-paused" style="width: 1809px;"> 
    <video height="416" width="720" data-subtitles="/sites/video/PublishingImages/test/test.jpg" poster="" preload="metadata" x-webkit-airplay="allow" class="video-js" tabindex="0" style=""> 
    <source type="video/mp4; codecs=&quot;avc1.42E01E, mp4a.40.2&quot;" src="/sites/video/PublishingImages/test/test.mp4"></source> 
    <source type="video/ogg; codecs=&quot;theora, vorbis&quot;" src="/sites/video/PublishingImages/test/test.ogv"></source> 

     <div class="vjs-flash-fallback"> 
      <img height="416" width="720" title="Ingen mulighet til å spille av video." alt="Ingen mulighet til å spille av video." src="/Style%20Library/gui/video-fail.jpg"> 
     </div> 
    </video> 
    <!-- Download links provided for devices that can't play video in the browser. --> 
    <p class="vjs-no-video" style="display: none;"> 
     <strong>Last ned video:</strong> <a href="/sites/video/PublishingImages/test/test.mp4">MP4</a>, 

     <a href="/sites/video/PublishingImages/Oppakning/test.ogv">Ogg</a><br> 
     <a href="http://videojs.com">HTML5 Video Player</a> by VideoJS 
    </p> 
<div class="vjs-styles-check" style="position: absolute; display: none;"></div><img src="http://m.test.aspx" class="vjs-poster" style="display: block; height: 1045px; width: 1809px;"><div class="vjs-big-play-button" style="display: block;"><span></span></div><div class="vjs-spinner"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div><div class="vjs-controls"><div class="vjs-play-control"><span></span></div><div class="vjs-progress-control"><div class="vjs-progress-holder"><div class="vjs-load-progress" style="width: 24.01%;"></div><div class="vjs-play-progress" style="width: 0%;"></div></div></div><div class="vjs-time-control"><span class="vjs-current-time-display">00:00</span><span>/</span><span class="vjs-duration-display">00:00</span></div><div class="vjs-volume-control"><div><span class="vjs-volume-level-on"></span><span class="vjs-volume-level-on"></span><span class="vjs-volume-level-on"></span><span class="vjs-volume-level-on"></span><span class="vjs-volume-level-on"></span><span></span></div></div><div class="vjs-fullscreen-control"><div><span></span><span></span><span></span><span></span></div></div></div></div> 

<div class="clear"></div> 

Answer 1

jQueryMobileが動的にページをロードしているので、あなたはVJSの動的な設定を使用する必要があります。あなたはread about it in the documentation on their websiteです。

そうようにあなたはおそらく、jQueryのpageInitにこれをしたいでしょう：画像は、以下に示すように

$('#videoPage').live('pageinit',function(event){ 
_V_("example_video_1", {}, function(){ 
     // Player (this) is initialized and ready. 
    }); 
}); 

Answer 2

私も、しかし、私は

それを釘付けと思い、このような問題に遭遇するだろう

2日、デバッグ、試行錯誤の後、私は（私も、あなたが従う示唆）のアクションを以下のかかった：最新のもの（バージョン1へ

1. アップグレードjquerymobileのlibが。 3.1）、 ビデオjs.js（バージョン4.1.0）
2. は...通常のWebサーバ（nginxのは、Apache、Tomcatを得る）私はそのを明確にしたいビデオ

にサービスを提供するためにjquerymobileはvideo-jsで作業しています。

そして、我々は、スナップショットから見ることができるようにアクション2

にもう少し説明し、ビデオが再生できない示すマークがあります。 と私は（それがジャンゴからのrunserverコマンドのpythonでツールキットのようなものだ）

は、ビデオは、開発のenvのために実行中のプロセスによって提供されていることを考慮に入れ、それを取ると、アプリケーションログをチェックしました。

iPadでビデオリソースをリクエストするたびに例外が発生しました。 したがって、私は自分のシステムでビデオプロバイダを変更しました。たとえば、nginxのように動作しました！

次のように成功したスナップショット：