固定位置在移动浏览器中不起作用
如何使元素位置固定在 移动浏览器（iOS和Android）中 ？元素仍在ios <5和android <4中使用以下代码滚动
<html>
<head>
<style>
.fixed{
position:fixed;
top:0;
left:0;
}
</style>
</head>
<body>
<div class="fixed">
Hi I m Position Fixed
</div>
<div>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
sample text<br/>
</div>
</body>
</html>
问题答案：
position: fixed在大多数的旧版本中不工作iOS和Blackberry。我已经在大多数移动浏览器中尝试了此修复程序，并且没有任何JavaScript插件即可正常运行。
采用
-webkit-backface-visibility: hidden;
.fixed {
position: fixed;
top: 0px;
left: 0px;
width: 320px;
height: 50px;
background: red;
-webkit-backface-visibility: hidden;
/*--^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ Most Important*/
}
<div class="fixed">
Hi I m Position Fixed
</div>
<div>
sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>sample text
<br/>
</div>
-
问题内容： 在iPhone / iPad / iPod上的Webkit中，点击元素时不会触发为标签的：active伪类指定样式。我该如何触发？示例代码： 问题答案： … 仅应用了一次，而不是每个按钮元素都可以修复页面上的所有按钮。另外，您可以使用这个名为’Fastclick’的小型JS库。它可以加快触摸设备上的点击事件，也可以解决此问题。
-
我试图打开应用程序（数字钱包应用程序）直接从网络浏览器（如果是移动）。 我已经提到了以下链接 在Android浏览器中创建链接启动我的应用程序？ 从android浏览器启动自定义android应用程序 为您提供信息，我正在努力将支付网关（数字钱包）集成到我的网站中，该网站有一种类似二维码（扫描和支付）的支付类型，另一种是deep app link，所以我正在实施的是，如果是网站，则支付类型将是二维
-
我有一个很奇怪的问题...在每个浏览器和移动版本中，我都遇到了这种行为： 当您加载页面时，所有浏览器都有一个顶部菜单（例如，显示地址栏），当您开始滚动页面时，该菜单向上滑动。 100vh有时只在视区的可见部分计算，因此当浏览器栏向上滑动时，100vh会增加（以像素为单位） 由于尺寸已更改，所有布局重新绘制并重新调整 对用户体验的不良影响 如何才能避免这个问题？当我第一次听说viewport-hei
-
问题内容： 我在移动设备（Bootstrap2）上的Bootstrap菜单下拉菜单中遇到问题。这里使用下拉按钮也提出了类似的问题，但是答案是引导程序中的一个固有错误，该错误已在更新中解决。我似乎遇到了同样的问题，所以可能是因为我的标记问题？ 我有一个带有下拉菜单的可折叠导航栏，所有功能在桌面浏览器上均能完美运行。但是，在移动设备上，当您单击下拉菜单时，下拉菜单将打开，但是单击任何下拉链接将仅再次折
-
问题内容： 我在使用SWT浏览器组件时遇到了一些麻烦。我正在运行带有Sun的Java SE 1.6的Ubuntu 11.04 AMD64和Eclipse 3.7 我的问题是我的浏览器无法初始化。当我使用SWT.NONE标志实现时，出现错误 然后当我尝试使用SWT.MOZILLA标志时，我得到 我怀疑这部分是因为我正在使用XULRunner2，但是我更喜欢使用WebKit，在Eclipse 3.7中
-
问题内容： 我有一个非常奇怪的问题……在每个浏览器和移动版本中，我都遇到了以下问题： 加载页面时，所有浏览器都有一个顶部菜单（例如，显示地址栏），当您开始滚动页面时，该菜单会向上滑动。 有时 仅在视口的可见部分计算100vh ，因此当浏览器栏向上滑动时100vh会增加（以像素为单位） 由于尺寸已更改，所有布局都会重新绘制和重新调整 对用户体验的不良影响 如何避免这个问题？当我第一次听说viewpo