2

jQuery Mobile を使用しています。すべてではありませんが特定のリンクについては、マークアップで次のページ遷移コードを使用しています。

data-transition="slide"

これはうまく機能していますが、iOS などでは引き続きスライド アニメーションを許可しながら、Android デバイスではスライド アニメーションを無効にしたいと考えています。

次のようなコードで Android をターゲットにできることはわかっています。

$(document).bind("mobileinit", function() {

    if (/Android/i.test(navigator.userAgent) ) {
        $.mobile.defaultPageTransition = "none";
    }

});

これによりデフォルトのトランジションは削除されますが、私のスライド トランジションはデフォルトではなく、マークアップで具体的に指定したトランジションです。

特定のデバイスでこのような特定のスライド遷移を無効/オーバーライドする方法を知っている人はいますか?

ありがとう！

4

2 に答える 2

2

jQM 開発者は完全な移行オフ ソリューションを実装していないため、完全なソリューションは存在しません。

それはまだ次のように行うことができます：

解決策 1

$(document).bind("mobileinit", function() {
    if (/Android/i.test(navigator.userAgent) ) {
        $.mobile.ajaxEnabled = false;
    }
});

これにより、ajax を使用したページの読み込みが妨げられ、ページの遷移が妨げられます。もちろん、ページを ajax でロードする必要がある場合、これはベッド ソリューションです。

解決策 2

このソリューションははるかに簡単になります。jQuery Mobile 1.3.1 を使用しています。このために、それが重要であることを信じてください。基本的にはjQuery Mobileのjsファイルを手動で変更する必要があるので、圧縮されていないものを使用してください。

3788 行目に移動すると、次の関数が表示されます。

// If transition is defined, check if css 3D transforms are supported, and if not, if a fallback is specified
$.mobile._maybeDegradeTransition = function( transition ) {
    if ( transition && !$.support.cssTransform3d && $.mobile.transitionFallbacks[ transition ] ) {
        transition = $.mobile.transitionFallbacks[ transition ];
    }
    return transition;
};

次のように変更します。

// If transition is defined, check if css 3D transforms are supported, and if not, if a fallback is specified
$.mobile._maybeDegradeTransition = function( transition ) {
    if (/Android/i.test(navigator.userAgent) || (!/Android/i.test(navigator.userAgent) &&  transition && !$.support.cssTransform3d && $.mobile.transitionFallbacks[ transition ] )) {
        transition = 'none';
    }
    return transition;
};

ここでテストできます: http://www.fajrunt.org/transition-test/

古いバージョンの jQM を使用している場合は、どのバージョンを使用しているか教えてください。修正します。私の例から変更された jQM js ファイルをダウンロードすることもできます。もう一度圧縮することを忘れないでください。

于 2013-05-22T16:59:33.293 に答える
0

次のように、1.3.0 でも同じことが実現できると思います。

$(document).bind("mobileinit", function() {

    if (/Android 2.2/i.test(navigator.userAgent) ) {
        console.log("Android 2.2 detected - changing default transition fallback behaviour to 'none'");
        //$.mobile.defaultPageTransition = "none";
        $.mobile.transitionFallbacks.slidefade="none";        
        $.mobile.transitionFallbacks.flip = "none";
        $.mobile.transitionFallbacks.flow = "none";
        $.mobile.transitionFallbacks.pop = "none";
        $.mobile.transitionFallbacks.slide = "none";
        $.mobile.transitionFallbacks.slidedown = "none";
        $.mobile.transitionFallbacks.slidefade = "none";
        $.mobile.transitionFallbacks.slideup = "none";
        $.mobile.transitionFallbacks.turn = "none";
    }

});
于 2013-06-07T09:31:10.790 に答える