PhoneGapでちらつきナビゲーションのためのJqueryモバイルコード

Question

私はこの投稿が私のトラブルの解決であると信じています Flickering when navigating between pages。 具体的に：私はC＃の世界から来てjQueryモバイルに関してはほとんど無知なのです

$(document).bind("mobileinit", function() 
{ 
    if (navigator.userAgent.indexOf("Android") != -1) 
    { 
    $.mobile.defaultPageTransition = 'none'; 
    $.mobile.defaultDialogTransition = 'none'; 
    } 
}); 

。私はこのスニペットを追加したいと思います。それが問題なら、私はjquery.mobile-1.1.0.rc.1.jsに追加すると思いますが、そこにはどこにあるのかわかりません。それが正しいファイルならば。

Answer 1

このコードは、jQueryコアを組み込んだ後、jQuery Mobileを組み込む前に実行する必要があります。理由は、コードを実行するにはjQueryが存在する必要がありますが、jQuery Mobileを初期化する前にこのイベントハンドラをバインドする必要があるからです。例えば

：

<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 
<script> 
$(document).bind("mobileinit", function() 
{ 
    if (navigator.userAgent.indexOf("Android") != -1) 
    { 
    $.mobile.defaultPageTransition = 'none'; 
    $.mobile.defaultDialogTransition = 'none'; 
    } 
}); 
</script> 
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 

ドキュメント：jQueryのモバイルサポートを変換CSSの3D用のデバイスをテストし、唯一のデバイス上での素敵なトランジションを使用しているため、またhttp://jquerymobile.com/demos/1.1.0/docs/api/globalconfig.html

は、スニッフィングUAは不要であることそれらをサポートする。これはjQuery Mobile 1.1.0以降で行われていますが、デフォルトのフォールバック遷移はfadeなので、そのデフォルトを変更する必要があります。デフォルトでは

非3Dサポートのためのフォールバック遷移を定義

、フェードを除くすべての遷移は、3Dのサポートを変換する必要があります。 3Dサポートを持たないデバイスは、指定された遷移に関係なく、フェードトランジション にフォールバックします。 Googleでは先進的に のAndroid 2.xのようなパフォーマンスの低いプラットフォームを先進的な の移行から除外して、まだ滑らかな体験を提供できるようにしています。 技術的に3D の変換をサポートするAndroid 3.0などのプラットフォームがありますが、まだアニメーションのパフォーマンスが悪いので、 はすべてのブラウザが100％フリッカーフリーになることを保証していませんが、 をこの責任を対象にしています。

3D変換をサポートしていないブラウザのフォールバックトランジション は、各トランジションタイプごとに設定できますが、デフォルトでは、フォールバックとして "fade"を指定しています。私はあなたの中if/then文を置くことに気づいた一般的な観察としてhttp://jquerymobile.com/demos/1.1.0/docs/pages/page-transitions.html

：

$.mobile.transitionFallbacks.slideout = "none" 

は出典：たとえば、これは「none」にslideout移行のためのフォールバック トランジションを設定しますイベントハンドラ、あなたはそれを外に置くこともできるので、Androidデバイスでなければ、イベントバインディング/起動は発生しません。例えば

：

<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> 
<script> 
if (navigator.userAgent.indexOf("Android") != -1) 
{ 
    $(document).bind("mobileinit", function() 
    { 
     $.mobile.defaultPageTransition = 'none'; 
     $.mobile.defaultDialogTransition = 'none'; 
    }); 
} 
</script> 
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script> 

Answer 2

私は同じ問題を持っている、とソリューションのいずれもオンライン動作するように見えません。私はAndroid 2.3.6で銀河のミニをテストしていますが、フェードさえUXの面でひどいものでした。

私のコードの周りいじる、運のうち、私は、これは、何のちらつきが奇跡によって多少

$(document).on("mobileinit", function(){ 
     $.mobile.defaultPageTransition = 'slide'; 
     $.mobile.transitionFallbacks='none'; 
}); 

そしてかのように自分のパフォーマンスを改善していないことが判明しました！いくつかのグリッチが時折発生しますが、それは間違いなく前よりも優れています！