jQuery Mobile：changepage幻燈片過渡在桌面上可以正常運行，但在Android設備上不能正常運行

Question

$('div.ui-page').live("swipeleft", function () {
    var nextpage = $(this).next('div[data-role="page"]');
    if (nextpage.length > 0) {
        $.mobile.changePage(
            nextpage,
            {transition: "slide"},
            true,
            true
        );
    }else{
        $.mobile.changePage(
            "#page3",
            {   transition: "slide", 
                reverse:true
            }, 
            true, 
            true
        );
    }
});

到目前為止，該代碼在台式機瀏覽器和iOS上都運行良好。 但是，當我在Android設備上運行此代碼時，頁面會閃爍，然后移至下一頁。 它應觸發幻燈片過渡選項，但未顯示幻燈片效果。

如何在Android網絡應用或移動瀏覽器上設置幻燈片效果？ 我已經嘗試過$(id).animate方法，但是沒有運氣。 我不知道該怎么做才能觸發幻燈片效果。

是否有已經嘗試過滑動功能的Android開發人員？ 有人可以告訴我如何調整$.mobile.changePage的滑動效果嗎？

Answer 1

http://jquerymobile.com/test/docs/pages/page-transitions.html

只看到淡入淡出過渡？ 要查看所有過渡類型，您必須使用支持3D變換的瀏覽器。 默認情況下，缺少3D支持的設備（例如Android 2.x）對於所有過渡類型都將退回到“淡入淡出”狀態。 此行為是可配置的（請參見下文）。

要檢查您的Android是否支持該代碼段，請將該代碼段添加到您的javascript中

window.onload = function () {
var b = document.body.style;
if(b.MozTransition=='' || b.WebkitTransition=='' || b.OTransition=='' || b.transition=='') {
    alert('supported');
} else {
    alert('NOT supported')
}

}

Answer 2

魯尼所說的是真的。 瀏覽器說它不支持過渡。 但是...讓我們不同意瀏覽器並繼續這樣做。 在jQuery mobile更改中：

// 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;
};

至：

$.mobile._maybeDegradeTransition = function( transition ) {
    return transition;
};

然后您就可以使用了。

但是您必須了解瀏覽器不會無緣無故地說它不支持它。 例如，Android上的瀏覽器在首次轉換時會失敗（不是Chrome）。