Androidの既定のブラウザがスクロールしていないWebページ

Question

私が構築しているページのAndroidのブラウザの在庫に問題があります。簡単に言えば、ページは最初にズームインすることなく垂直方向にスクロールしません。私はタグがブラウザのウィンドウよりも小さい高さを報告していると思ったときにわかったと思ったが、それを修正してもスクロールの問題は解決しなかった。 （インデックスページの黒いボックスは、計算された要素の高さを報告します）

私のテストデバイスは、Android 2.3を実行しているDroid Incredibleです。スクロールは、Android用Firefox、Android 4.0タブレット、すべてのiOSデバイスで動作します。サイトの

私のdevのビルドはここにある：www.adamjdesigns.info/csu/engage

EDIT - 私が試した他のコード：

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'}); }

をすべてのヘルプは大歓迎です！

Answer 1

が、私はそれを考え出しました！このページにはYouTubeのビデオ用にiframeがありましたが、それ自体がiframeであるか動画内でビデオを再生するための関連スクリプトであるかはわかりませんが、DOMから取り除くことで問題は解決しました。 （私はそれをモバイル画面に隠してしまったのですが）

皆さん、助けてくれてありがとう！

Answer 2

はあなたのビューポートのためにこれを試してみてください：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 

Answer 3

ハックですが、私は開発者を助けるかもしれない別の修正をしています。私は在庫のAndroid 2.3.4ブラウザで、最初のページの読み込みサイズを「1」からわずかに増加したサイズに上げると、垂直スクロールは最初にズームをピンチする必要なく機能することがわかりました。例：

<meta name="viewport" content="width=device-width, initial-scale=1.02" /> 

Answer 4

私が問題になったのは、overflow-x：hiddenを追加したことです。私のボディータグに。これは水平スクロールバーをオフにするはずですが、Androidでは垂直スクロールバーをオフにします。そしてAndroidでは、私は水平方向にのみスクロールすることができます。おそらくAndroidブラウザのバグです。私は古いAndroid携帯電話（HTC Thunderbolt）を使用しています。私は私のCSSファイルを通過し、すべてのoverflow-x：hiddenを削除しました。

Answer 5

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> 

このソリューションでは、最初のAndroidのバージョンを検出し、「ハッキング」の値にメタタグの内容を変更するには、条件付きJavaScriptを使用して、その後、ほとんどのデバイスとの素晴らしい作品の通常のメタビューポートタグを設定し、 （Gatsbyによって提供されている）< = 2.3でのスクロールが可能です。これにより、ハッキングを必要としないデバイスのための不要な水平スクロールが防止されます。