16

Android の Chrome でページのズームを防止しようとしていますが、動作したくありません。以下のコードを使用しています。これは、標準の Android ブラウザーと iOS の Safari で正常に動作します。何かご意見は？

<meta content='width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;' name='viewport' />

    <meta name="viewport" content="width=device-width" />
4

2 に答える 2

16

メタ タグに追加minimum-scale=1してみてください。viewportそれでも問題が解決しない場合は、Chrome for Android でズームの無効化がサポートされていない可能性があります (たとえば、HTC 独自のブラウザでは意図的にズームを無効にできません)。

更新: 確認したところ、Chromeはズームの無効化をサポートしているようですが、コードにビューポート タグが 2 つありますか? 2 番目のものは最初のものをオーバーライドしている可能性があります。2 番目のものを削除します。

詳細については、ズームを無効にするためのモバイル ブラウザー サポートのリストと、複数のブラウザー間でズームを無効にするための適切な提案を参照してください。

于 2012-11-10T13:28:50.250 に答える
12

developer.android.comのTargeting Screens from Web Appsに従って、ベルトとブレースのアプローチを使用して、利用可能なすべてのビューポート設定を構成しています

次の構文は、サポートされているすべてのビューポート プロパティと、それぞれが受け入れる値の一般的なタイプを示しています。

<meta name="viewport"
  content="
    height = [pixel_value | device-height] ,
    width = [pixel_value | device-width ] ,
    initial-scale = float_value ,
    minimum-scale = float_value ,
    maximum-scale = float_value ,
    user-scalable = [yes | no] ,
    target-densitydpi = [dpi_value | 
     device-dpi | high-dpi | medium-dpi | low-dpi]
    " />

ズームなしの構成済みメタ タグ:

<meta name="viewport"
  content="
    height = device-height,
    width = device-width,
    initial-scale = 1.0,
    minimum-scale = 1.0,
    maximum-scale = 1.0,
    user-scalable = no,
    target-densitydpi = device-dpi
    " />

そして、ワンライナーとして：

<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, target-densitydpi=device-dpi" />
于 2012-11-19T14:51:10.050 に答える