1. ホーム
  2. javascript

[解決済み] モバイルサファリのviewport metaタグはその場で変更できますか?

2022-12-15 02:25:51

質問

モバイルSafariブラウザ用に作られたAJAXアプリがあるのですが、異なるタイプのコンテンツを表示する必要があります。

あるコンテンツでは user-scalable=1 が必要で、他のものには user-scalable=0 .

ページを更新せずにcontent属性の値を変更する方法はありますか?

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

どのように解決するのですか?

私はこれが少し古いですが、はい、それは行うことができます実現しています。いくつかのjavascriptで始められます。

viewport = document.querySelector("meta[name=viewport]");
viewport.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');

必要な部分を変更するだけで、Mobile Safariは新しい設定を尊重します。

更新しました。

もし、ソースにmeta viewportタグがまだない場合は、以下のような感じで直接追記することができます。

var metaTag=document.createElement('meta');
metaTag.name = "viewport"
metaTag.content = "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
document.getElementsByTagName('head')[0].appendChild(metaTag);

あるいはjQueryを使う場合。

$('head').append('<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">');