9

我正在构建的页面上的库存 Android 浏览器存在问题。简单地说，页面不会在不先放大的情况下垂直滚动。当我发现标签报告的高度小于浏览器窗口的高度时，我以为我已经弄清楚了，但是修复该问题并不能解决滚动问题。（索引页面上的黑框报告元素的计算高度。）

我的测试设备是运行 Android 2.3 的 Droid Incredible。滚动功能适用于 Android 版 Firefox，以及我的 Android 4.0 平板电脑和所有 iOS 设备。

我的网站开发版本在这里：www.adamjdesigns.info/csu/engage

编辑 - 我尝试过的其他代码：

  1. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
  2. if(navigator.userAgent.match(/Android 2/) && $(window).height() < 600) { $('html').css({'height':$(window).height(),'overflow':'auto'}); }

任何帮助是极大的赞赏！

4

5 回答 5

9

虽然这是一个 hack，但我还有另一个可能对开发人员有所帮助的修复程序。我发现使用现有的 Android 2.3.4 浏览器，如果将初始页面加载大小从“1”增加到稍微增加的大小，则垂直滚动可以正常工作，而无需先捏缩放。例如：

<meta name="viewport" content="width=device-width, initial-scale=1.02" />
于 2013-01-21T23:15:52.757 回答
3

我想到了！页面中有iframe一个 YouTube 视频，我不确定是它iframe本身还是在其中播放视频的相关脚本，但是从 DOM 中删除它解决了这个问题。（无论如何，我都将它设置为隐藏在移动屏幕上。）

谢谢大家的帮助！

于 2012-06-13T21:47:14.577 回答
3

FWIW，我的网页在 Android 2.3 中没有滚动时遇到了类似的问题。我使用了 Gatsby 的回答和一些有条件的 Javascript 来解决这个问题。这是我的最终代码：

<meta name="viewport" content="width=device-width, initial-scale=1.00"/>
<script type="text/javascript">
    window.onload=function(){
        var ua = navigator.userAgent;
        if(ua.indexOf("Android")>=0){
            var androidversion=parseFloat(ua.slice(ua.indexOf("Android")+8)); 
            if(androidversion<=2.3){
                document.getElementsByName("viewport")[0].setAttribute("content","width=device-width, initial-scale=1.02");
            }
        }
    };
</script>

此解决方案首先设置适用于大多数设备的正常元视口标签，然后使用条件 javascript 检测 android 版本并将元标签内容更改为允许在 Android <= 上滚动的“hacked”值（由 Gatsby 提供） 2.3. 这可以防止不需要 hack 的设备进行不必要的水平滚动。

于 2013-09-25T12:53:49.323 回答
2

我发现问题是我添加了溢出-x：隐藏；到我的身体标签。这应该关闭水平滚动条，但在 Android 中它会关闭垂直滚动条。在 Android 中，我只能水平滚动。可能是Android浏览器中的一个错误。我正在使用旧的安卓手机（HTC Thunderbolt）。我浏览了我的 css 文件并删除了所有 overflow-x:hidden ，现在我可以再次垂直滚动。

于 2013-07-11T03:02:56.523 回答
1

试试这个为你的视口：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
于 2012-06-12T19:01:49.407 回答