Phonegap/jquery移动幻灯片转换在第一次通话时无法正常工作

我有一个令人尴尬的视觉问题。我希望在应用程序上更改页面时有一个好的过渡。 不幸的是，当我第一次切换到另一个页面时，不是将当前页面滑出，而是将当前页面立即替换为新页面，然后滑出。当第一页不在视图中时，将显示新页。然而，第二次，它就像一个魅力

这是在iphone上运行的jQuery Mobile+PhoneGap

我制作了一个视频来帮助澄清这个问题：

还有一点JS：

    ///////////////////////////////////
    //MENU MECHANICS
    ///////////////////////////////////

    function showdives(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_dives").addClass("selected");
    }

    function showexplore(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_explore").addClass("selected");
    }
    function showsearch(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_search").addClass("selected");
    }
    function showsettings(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_settings").addClass("selected");
    }

---

onclick方法只在菜单项中添加/删除所选类。

我相信人们会将其称为闪烁，因此在搜索时会得到更好的结果。环顾四周后，您的问题似乎在android上很常见，可以通过添加以下CSS来解决：

.ui-page {
    -webkit-backface-visibility: hidden;
}

以下是一些参考资料：

---

我和我的朋友正在使用jQuery1.2

解决此问题的方法是将data transition=none。也许这不可能出现在手机上

样式设置如此之多，但仍有效并删除闪烁问题

---

希望能有所帮助。

我也遇到了同样的问题，但更糟糕的是，在Phonegap中包装Jquery移动应用程序时。不仅页面转换闪烁，而且用户界面完全被破坏。我在这个应用程序中使用了Jquery 1.8和Jquery mobile 1.2

---

我已经尝试了这里所建议的大多数解决方案，但没有任何效果。然后我找到了皮奥特·沃尔琴斯基的解决方案，一切都像梦一样顺利！强烈推荐同时使用Jquery mobile和Phonegap的用户

很好的视频和问题的解释。您的问题可能存在于Javascript中，因此您也应该包含该代码。如果您在处理程序中执行$.mobile.changePage，并将页面ID放在链接的href属性中，我认为这可以解释这一问题。使用changePage或href属性，但不能两者都使用？嗨，约翰-不，我只使用href:/done:正如你所看到的，它很简单…也可以像charmHi Spike一样转换弹出和翻转操作-尝试过，但不是：我真的认为它不会闪烁：/Hmm。。。对不起，我当时不知道。也许是安卓模拟器？它在iOS上做同样的事情吗？我只在iOS上有ISSI——android很好，在这两种情况下，emu和设备的行为都是一样的。我真的不知道还有什么好建议。。。如果我是你，我会从头开始，开始一点一点地添加每段代码，以准确地找出是哪一部分导致了故障。我遇到了完全相同的问题。

    ///////////////////////////////////
    //MENU MECHANICS
    ///////////////////////////////////

    function showdives(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_dives").addClass("selected");
    }

    function showexplore(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_explore").addClass("selected");
    }
    function showsearch(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_search").addClass("selected");
    }
    function showsettings(){
        $("#side-menu .selected").removeClass("selected");
        $("#header_settings").addClass("selected");
    }

.ui-page {
    -webkit-backface-visibility: hidden;
}