Javscriptネタです。
最近は、iPhone/Androidのブラウザで表示する画面を作る時に、Viewportの設定は必須になってきています。
iPhoneとかで画面がかなり大きく表示されるので、とても便利なんですがuser-scalable(ユーザ操作によるページの拡大や縮小)とかはページによっては変更したい時もあります。
通常のViewportの設定は、htmlのheadタグにこんな感じで書きます。
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
調べたら出来たので、備忘録として
htmlのheadタグに直書きした場合は出来ないみたいなので、javascriptでタグを作って、それを操作します。
<script type="text/javascript"> var vp = document.createElement('meta'); vp.setAttribute('name', 'viewport'); vp.setAttribute('content', 'user-scalable=0'); document.getElementsByTagName('head')[0].appendChild(vp); </script>
後は、javascriptからvpオブジェクトにアクセスできれば、setAttributeで変更できるという訳です。
実際にやってみると分かりますが、user-scalableなどは変更が即変更されますが、widthなどは、変更して表示にすぐに影響があるわけでは無いみたいなので、使い方には注意が必要になります。