我在使用 phonegap 制作的应用程序上固定位置时遇到问题。 直到现在我认为它在正常运行，但我发现在特定情况下该位置固定“中断”.. 我在顶部有一行 (div) 和几个选项卡，每个选项卡的 onclick 都有一些 javascript 和 css 我使用显示属性更改主视图..
不过我发现，如果我在 View 上向下滚动，然后选择更改选项卡，那么整行选项卡不会“固定”在顶部，而是向下移动，并“固定”在一个新的低于最高位置..
我的代码的主要布局是
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<head>
</head>
<body>
<div id="tabwrap">a couple of divs for tabs blah blah</div>
<div id="content">main view with hide/show etc</div>
</body>
(我包含了 meta viewport 标签只是为了表明我也在使用它) 如果主视图没有向下滚动，而是在顶部，那么固定的位置就不会中断，并且会按预期保持在顶部。 我试图通过在这一行的每个选项卡的 onclick 事件上添加来“欺骗”它
document.body.scrollTop = document.documentElement.scrollTop = 0;
这样它会在加载相应div中的下一个内容之前返回顶部，但没有成功..
和CSS
#tabwrap {height:3em; position:fixed; width:100%; }
#content { padding-top:4em; width:100%; }
这是jsfiddle的一个小demo，不知道有没有用.. http://jsfiddle.net/B3Y5N/7/ 我已经删除了一些代码以使其更简单
奇怪的是，在 2.3.5 (samsung s5570) 上没有问题，我注意到 4.2.2 (nexus) 上的问题，而我期望相反..
最佳答案
这里我所做的更改似乎已经解决了这个问题..
#tabwrap {height:3em; position:fixed; width:100%; top:0; left:0; z-index:100;}
#content {position absolute; top:4em; width:100%; height:100%}
也从 html 文档中删除了
height:device-height
来自
meta name=viewport tag
关于Android Phonegap/Webkit/Viewport 位置固定，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15374959/