5

任何想法如何消除滚动过程中出现的间隙（在屏幕上）？标头已固定位置，并且间隙仅出现在 Androd 上（在 Android 4.0.4 上测试）。

差距

负责头部的部分代码：

HTML：

<div data-role="page" id="settings">
    <div class="holo-action-bar">
        <h1><span>Settings</span></h1>
    </div>
    <div class="content content-inner"></div>
</div>

CSS：

.holo-action-bar {
  background-color: #333;
  color: #fff;
  display: block;
  position: fixed;
  top: 0; right: 0; left: 0;
  width: 100%;
  z-index: 1000;
}

您还可以在jquery mobile docs中查看示例

更新：

在 iOS 上不会出现该问题（在 iOS 5+ 上测试）

4

4 回答 4

1

我找到了解决方案：

这是 phonegap 上的 CSS 问题。

body {
   << height : 100%; don't use it >>
   width: 100%;
   margin:0;
   padding:0;
   top: -1px;
}

硬件加速：真

于 2014-03-17T05:49:39.157 回答
0

我遇到了同样的问题，当我在我的 activity.java 中添加这一行时意外地解决了它：

mWebView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

并android:hardwareAccelerated="true"在<application>标签下的清单中。这试图禁用软件渲染器以支持硬件渲染器，并且它在我的 4.0.1 设备上运行。

如果您使用带有固定页眉和页脚的 webview，您可能还需要添加以下内容，以便页眉/页脚上的闪烁动画消失：

mWebView.setOverScrollMode(View.OVER_SCROLL_NEVER);
于 2013-04-29T00:08:53.460 回答
0

但删除你的 data-position="fixed"

上课

<div id="header"><h1>Fixed header!</h1></div>

CSS：

#header{
 position:fixed;
 top:0;
}

编辑*

您是否尝试过检查内部对象的边距？如果它的 ap 标签或 h1 左右它们有标准边距

如果我查看您提供的链接，顺便说一句，我不喜欢 jquery mobile，因为它带来的问题多于它对 tbh 的帮助。但无论如何，它似乎有一个 1px 左右的边框，您有指向您网站的链接吗？

于 2013-02-01T11:35:34.723 回答
0

当使用带有 Cordova 3.0.0 的 Intel App Framework 2 时，我在 Android 4 pad 的固定标题上方有 1px 的间隙。目标 Android 版本设置为 4.3。

当我在之前的项目中将目标 Android 版本设置为 2.3.3 时，问题不存在。

最后我发现当我在 AndroidManifest.xml 中设置 hardwareAccelerated="false" （在两个地方）时，1 px 的差距消失了。

于 2013-10-22T07:29:05.913 回答