Mr.*_* 安宇 25 css android webkit css-position samsung-mobile
自2.2以来,Android浏览器支持固定定位,至少在某些情况下,例如关闭缩放时.我有一个没有JS的简单HTML文件,但我试过的三部三星手机的固定定位是完全错误的.不是真正的固定定位,标题滚动出视图,然后在滚动完成后弹回原位.
对于我测试过的任何配置,Android SDK仿真器都不会发生这种情况(2.2,2.3,2.3 x86,4.0.4).在三星手机上的应用程序中使用WebView时也不会发生这种情况:在这些情况下,定位按预期工作.
有没有办法让三星Android"股票"浏览器使用真正的固定定位?
我测试过:1.三星Galaxy 551,Android 2.2 2.三星Galaxy S,Android 2.3 3.三星Galaxy S II,Android 2.3
示例代码:
<html>
<head>
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0,user-scalable=no,width=device-width,height=device-height">
<style>
h1 { position: fixed; top: 0; left: 0; height: 32px; background-color: #CDCDCD; color: black; font-size: 32px; line-height: 32px; padding: 2px; width: 100%; margin: 0;}
p { margin-top: 36px; }
</style>
</head>
<body>
<h1>Header</h1>
<p>Long text goes here</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
预期的行为是灰色标题填充屏幕的顶部,无论你滚动多少,都会保持不变.在三星Android浏览器上,它似乎滚动出视图,然后在滚动完成后重新弹回到位,好像使用Javascript模拟固定定位,但事实并非如此.
编辑 根据评论和"答案"判断,似乎我不清楚我需要什么.我正在寻找一个元标记或css规则/黑客或javascript切换,关闭三星的破碎固定位置,并打开Android浏览器的工作固定位置.我不是在寻找一个Javascript解决方案,它将破坏的固定定位添加到没有任何支持的浏览器中; 三星固定定位已经做到了,它只是看起来很愚蠢.
小智 1
也许您可以考虑一种不需要固定定位的不同方法......
添加滚动到段落元素而不是(默认)主体元素。然后,您可以将段落元素放置在标题的正下方。这将确保标题始终显示在页面顶部,同时允许您滚动浏览段落中的文本。
h1 {
height: 20px;
}
p {
position: absolute;
top: 20px;
left: 0px;
right: 0px;
bottom: 0px;
overflow-y: auto;
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
24162 次 |
| 最近记录: |