1
$('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 Web 应用程序或移动浏览器上设置幻灯片效果?我已经尝试过该$(id).animate方法,但没有运气。我不知道我应该怎么做才能触发幻灯片效果。

有没有尝试过刷卡功能的安卓开发者?谁能告诉我应该怎么做才能调整幻灯片效果$.mobile.changePage

4

2 回答 2

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')
}

}

于 2012-12-03T07:48:35.610 回答
0

罗恩说的是真的。浏览器说它不支持过渡。但是......让我们不同意浏览器,无论如何都要这样做。在 jQuery 移动更改中:

// 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)。

于 2012-12-03T09:52:05.447 回答