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

Question

我相信这篇文章解决了我的麻烦 在页面之间导航时闪烁.特别:

$(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转换的浏览器的回退转换,但默认情况下,我们将"淡入淡出"指定为回退.例如,这会将滑出过渡的后备过渡设置为"none":

$.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>