android - 如何在某些设备的某些链接上禁用 "Slide"页面转换？ -defaultPageTransition 本身是不够的

Question

我正在使用 jQuery Mobile。对于某些链接 - 但不是全部，我在我的标记中使用了以下页面转换代码:

data-transition="slide"

这运行良好，但我想在 Android 设备中禁用幻灯片动画，同时仍允许在 iOS 等设备中使用幻灯片动画...

我知道我可以使用如下代码来定位 Android:

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

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

});

虽然这确实删除了默认过渡，但我的幻灯片过渡不是默认过渡，而是我在标记中专门指定的过渡。

有谁知道如何在特定设备中禁用/覆盖像这样的特定幻灯片切换？

谢谢!

Answer 1

完美的解决方案不存在，因为 jQM 开发人员没有实现完美的过渡关闭解决方案。

还是可以这样做:

方案一

$(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 文件。不要忘记再次压缩它。