为什么我的jQuery Mobile的应用程序不会在Android 4.0.3浏览器中正确显示？ [英] Why does my jQuery Mobile app not show correctly in the Android 4.0.3 browser?

问题描述

我有使用Chrome，FF，移动Safari和Android上2.2浏览器中查看时，正在运行的jQuery Mobile的（1.1.0）的应用程序。然而，在浏览器在Android 4.0.3模拟器观察时，有一系列问题。

I've got a jQuery Mobile (1.1.0) app that is running when viewed using Chrome, FF, Mobile Safari and the browser on Android 2.2. However, when viewed in the browser in the Android 4.0.3 simulator there are a range of issues.

这包括：

1）不显示标题栏（它显示简单的表演，他们的消失 - 固定页脚是罚款）

1) Header bar isn't displayed (it displays briefly on show and them disappears - fixed footer is fine).

2）的页面上的按钮不显示 - 但仍然接收和正确处理单击事件

2) Buttons on the page aren't shown - but still receive and process the click events correctly.

这也发生在一位同事的ICS Android手机（Galaxy Nexus的）。

This also happens on a colleague's ICS Android Phone (Galaxy Nexus).

标记是所有JQM相当标准。主要按钮的标签，例如。标题是：

Markup is all fairly standard for jQM. Main buttons are tags, for example. Header is:

<header data-role="header">
    <h1 data-bind="text: theTitle"></h1>

    <a id="waitButton" href="#" class="ui-btn-left" data-bind="click: wait">Wait</a>
    <a id="pollButton" href="#" class="ui-btn-right" data-bind="click: poll">Poll</a>
</header>

[数据绑定属性是Knockout.js]

[data-bind attributes are for Knockout.js]

有谁知道我需要改变，以得到它ICS工作吗？还是这一个为jQuery Mobile的进展中的工作？

Does anyone know what I need to alter to get it working on ICS? Or is this a "work in progress" for jQuery Mobile?

推荐答案

发现问题。这是我在我的iOS测试过程中添加了这个CSS规则：

Found the problem. It was this css rule that I added during my iOS testing:

.ui-page 
{
    /* Supposed to reduce flickering, but screwed up Ice Cream Sandwich. */
    -webkit-backface-visibility: hidden;
}

这篇关于为什么我的jQuery Mobile的应用程序不会在Android 4.0.3浏览器中正确显示？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！