避免在jQuery手机中闪烁(白屏)

时间:2013-10-29 09:47:48

标签: javascript jquery jquery-mobile cordova

我正在开发一个phonegap应用程序,我使用了一个多页面模板,如page1.html,page2.html。每个页面都会命中服务器并呈现输出并将其显示在列表视图中。所以问题是如果我点击从一个页面重定向到另一个页面意味着它显示白色屏幕。

当我进行谷歌搜索时,我也尝试了很多可能的方法。但这对我没有帮助。

My code is given below:
$('#content').append('<div class="wholediv"><span class = "wholediv_content"><a style="text-decoration:none!important;"href="'+v.pagename+'.html?id='+v.nodeId +'&catname='+ v.pagecat +'"   data-ajax="false">'+'<img src="http://www.examole.com/'+image+' "  class="eventsimages" alt = "image"/>'+'<br /><p>'+v.pagename+'</p></a></span></div>');

index.html:

<div data-role="page">

            <div data-theme="a" data-role="header" data-position="fixed" data-tap-toggle = "false"  style="height:45px;">
                <h3 id = "title">
                    Moble
                </h3>
                <span class="off new_off" id = "off" >Off</span>
            </div>

               <div data-role="content" id="content">

            </div><!-- /content -->


        </div><!-- /page -->
    </body>

我需要避免闪烁。请我做了很多搜索并应用了所有那些对我没有帮助的答案。如果我使用数据转换意味着我需要删除data-ajax="false"。怎么办?

1 个答案:

答案 0 :(得分:2)

双重闪烁或双重闪烁是一个众所周知的问题。

Rob发布的解决方案实际上是有效的。

在邮件css文件中设置:

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

在视口标记中使用此选项:

user-scalable=no

我为phonegap制作了一个基本模板。使用Jquery mobile等等。

http://www.codemonkey.mobi/guides/base.zip

我没有看到任何带有我的基础的白色屏幕。

如果这对您有用,请告诉我们。

也试试这个:

http://blog.hackedexistence.com/phonegap-jquery-mobile-white-screen-flicker-solved

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />