Question

我相信这篇文章解决了我的麻烦 Flickering when navigating between pages。具体做法是：

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

我来自C＃世界，对于jQuery移动来说几乎一无所知。我想添加这个片段，但不知道在哪里。如果重要的话我认为我会将其添加到jquery.mobile-1.1.0.rc.1.js但是我不知道在哪里，如果那是正确的文件。

Answer 1

在包含jQuery Core之后和包含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>

文档：http://jquerymobile.com/demos/1.1.0/docs/api/globalconfig.html

此外，UA嗅探并不是必需的，因为jQuery Mobile测试设备是否支持CSS 3D转换，并且仅在支持它们的设备上使用漂亮的转换。这是在jQuery Mobile 1.1.0+中为您完成的，但默认的回退转换为fade，因此您无论如何都必须更改该默认值。

定义非3D支持的后备过渡

默认情况下，除淡化之外的所有过渡都需要3D变换支持。   缺乏3D支持的设备将退回到淡入淡出过渡，   无论指定的转换如何。我们主动这样做   从高级版中排除Android 2.x等表现不佳的平台   过渡并确保他们仍然拥有顺畅的体验。注意   Android 3.0等平台在技术上支持3D   转换，但仍然有不佳的动画性能，所以这不会   保证每个浏览器都是100％无闪烁，但我们尝试   负责任地瞄准这个目标。

不支持3D转换的浏览器的后备转换   可以为每种转换类型配置，但默认情况下我们指定   ＆＃34;褪色＆＃34;作为后备。例如，这将设置回退   将幻灯片转换过渡到＆＃34;无＆＃34;：

$.mobile.transitionFallbacks.slideout = "none"

来源：http://jquerymobile.com/demos/1.1.0/docs/pages/page-transitions.html

作为一般观察，我注意到你将if/then语句放在事件处理程序中，你可能也把它放在外面所以如果它不是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进行Galaxy mini测试，甚至在UX方面也很糟糕。

摆弄我的代码，运气不好我发现这有点改善了我的表现

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

好像奇迹一样，没有闪烁！偶尔会出现一些故障，但它肯定比以前更好！

Jquery使用PhoneGap进行闪烁导航的移动代码

2 个答案: