2011-07-22 9 views
0

jQuery Mobileを使用して、埋め込まれたYouTubeクリップをページの1つに表示するサイトを作成しています。遅延jQuery埋め込みのYoutubeビデオを隠すためのモバイルの移行

私の問題は、ユーザーが別のページにナビゲートしようとすると、埋め込みオブジェクトが、トランジションの再生中にページの「上」にとどまることです。その結果、ビデオは2ページ目に2秒間表示され、うまく見えません。

リンク上でクリックしたときにビデオで.hide()を使用しようとしましたが、タイムアウトを作成しようとしましたが役に立たないものがありました。

答えて

0

それは私が正しいイベントを捕捉していなかった結局のところ - 私はそうのような「タップ」イベントにバインドするために必要なときに、私はクリックをチェックした

$("#link").live('tap',function(){ 
    $("#video").hide(); 
}); 
0

ページから実際のビデオを削除する必要があります。 Flashは通常、他のすべてのコンテンツに表示されるため、これはすべてのブラウザでも発生します。

+0

答えがありがとうございますが、.hide()はうまくいきますので、下の私の答えをご覧ください。 – Ger

0

あなたは「pagebeforehide」を使用することができますイベントを使用してFlashビデオを削除することもできますが、YouTubeのiframe埋め込みメソッドを使用して埋め込みタグではなく動画を表示することもできます(iframeメソッドを使用して永続的なフラッシュオブジェクトに問題はありません)。

 
$('#youtube_page_id').live('pagebeforehide', function() { 
    $('#youtube_embed_id').remove(); 
}); 
 
<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0"> 

ユーチューブとIFRAMEの方法を使用する別の利点は、ユーチューブは、ユーザが上にあるデバイスを検出し、映像の適切なタイプを表示することです。たとえば、ユーザーがiPhoneを使用している場合、YouTubeはFlashビデオではなくHTML5ビデオを表示します。

+0

iframeソリューションはビデオの表示/非表示の問題を実際に解決しますが、埋め込みFlashオブジェクトほどエレガントではありません。例えば、ビデオはフラッシュオプションのようにスケールされず、ビデオタイトルがオーバーレイとして表示され、プレイヤーはモバイルデバイス上で非常に窮屈に見える。さらに、動作が不安定に見える - 時にはビデオがhtml5ビデオとして即座に再生され、モバイルYouTubeサイトが読み込まれることもあります。返信いただきありがとうございます:-) – Ger

関連する問題