0

さまざまなビューポートサイズで動作するネイティブモバイルWebサイトがありますが、メディアクエリで属性を変更する代わりに、Webサイトの初期スケールのみを変更したいと考えています。

ビューポートサイズごとに初期スケールを変更するにはどうすればよいですか？メディアクエリで動作しますか？

4

2 に答える 2

1

これはJavaScriptで行うことができます。私は次のようなことをしました：

 if (document.documentElement.clientWidth < 480) {
            document
                .querySelector("meta[name=viewport]")
                .setAttribute('content', 'initial-scale=0.4', 'maximum-scale=0.4', 'width=768');
        };

これはiPad用に設計されたサイト用ですが、iPhoneなどにスケールアウトしたい.

于 2013-02-15T11:52:09.453 に答える
1

おそらく、「初期スケール」を設定する最も一般的な方法は、デバイスの幅をビューポートの幅として使用するようブラウザに指示することです。

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

二次的な質問に続きますが、はい、これは明らかに、デバイスの幅に対してビューポートの幅を設定することで、さまざまなビューポートのサイズでうまく機能し、メディア クエリと互換性があります。

この記事で詳細を説明しています: http://tech.bluesmoon.info/2011/01/device-width-and-how-not-to-hate-your.html

于 2013-02-15T12:25:01.897 に答える