回答:
これは少し古いと思いますが、可能です。あなたが始めるためのいくつかの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は新しい設定を尊重します。
更新:
ソースにメタビューポートタグがない場合は、次のように直接追加できます。
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">');
$('head').append('<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">');
または、jQueryがない場合:document.getElementsByTagName('head')[0].appendChild( ... );
viewport.setAttribute('content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');
あなたの <head>
<meta id="viewport"
name="viewport"
content="width=1024, height=768, initial-scale=0, minimum-scale=0.25" />
あなたのJavaScriptのどこかに
document.getElementById("viewport").setAttribute("content",
"initial-scale=0.5; maximum-scale=1.0; user-scalable=0;");
...しかし、デバイス用に微調整したり、何時間もいじったりして頑張ってください...そして、私はまだそこにはいません!
これはほとんどの部分で回答されていますが、私は拡大します...
ステップ1
私の目標は、特定の時間にズームを有効にし、他の時間には無効にすることでした。
// enable pinch zoom
var $viewport = $('head meta[name="viewport"]');
$viewport.attr('content', 'width=device-width, initial-scale=1, maximum-scale=4');
// ...later...
// disable pinch zoom
$viewport.attr('content', 'width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no');
ステップ2
ビューポートタグは更新されますが、ピンチズームはまだアクティブです!! ページに変更を反映させる方法を見つける必要がありました...
これはハックソリューションですが、体の不透明度を切り替えるとうまくいきます。これを達成する他の方法があると確信していますが、ここで私のために働いたものがあります。
// after updating viewport tag, force the page to pick up changes
document.body.style.opacity = .9999;
setTimeout(function(){
document.body.style.opacity = 1;
}, 1);
ステップ3
私の問題はこの時点でほとんど解決されましたが、完全には解決されませんでした。ページに収まるようにいくつかの要素のサイズを変更できるように、ページの現在のズームレベルを知る必要がありました(マップマーカーを考えてみてください)。
// check zoom level during user interaction, or on animation frame
var currentZoom = $document.width() / window.innerWidth;
これが誰かの役に立つことを願っています。解決策を見つける前に、マウスを叩いて数時間過ごしました。
viewport = document.querySelector("meta[name=viewport]"); viewport.setAttribute('content', 'width=1020');
あるコンテキストの場合のみ:これを多少ロックダウンされたDrupalインスタンスに入れています...したがって、ヘッドエリアに直接アクセスできず、Javascriptを使用する必要があります)