ブラウザの表示倍率を無理やり100%に見せる(ただしIE限定、動作確認は8のみ)

  • このエントリーをはてなブックマークに追加
  • LINEで送る

サンプル / http://sakurachiro.com/_exercise/html_css/zoom1/index.html
(IEで表示倍率を変更すると確認出来ます)

ブラウザの表示倍率をリセットする方法は無いかな?と試行錯誤してみました。

ちょっと調べてみるとscreen.devicexdpiってのを使うと画面のdpiがわかるみたい

参考にさせてもらったページ
javascript screen deviceXDPI, deviceYDPI, logicalXDPI, logicalYDPI
deviceXDPI Property (screen, Screen Constructor)
これでできる! クロスブラウザJavaScript入門:第19回 CSSOM View Module解説

windowsは96でIEの表示を400%にしてる時は384。

そこに直接数字を入れたらコントロールできるかのか?と
screen.devicexdpi=96;みたいにしても反応なし。
読み取るだけなのか、使い方を間違ってるのかとにかくこの方法じゃ出来なかった。

なのでzoomプロパティを使って拡大してる分を縮小させてみる事に。
こんな感じ
[js]function cz(){
if (screen.deviceXDPI !=96) {
var dxd=screen.deviceXDPI;
var nowMagniFication=dxd/96;
var chgZoom=1/nowMagniFication;

document.body.style.zoom=chgZoom;
document.body.style.width=document.body.clientWidth*nowMagniFication+"px";
}
}
window.onload=cz;[/js]

zoomを1になるようにしても
横幅が拡大した時のサイズにあわせて変更されちゃうので
document.body.clientWidthを倍率に合わせて拡張

スクロールバーが表示されるのでbodyにoverflow-x:hidden;を指定して切捨て。
window.onloadとwindow.onresizeで呼び出してみたけど
書き方が悪いのかwindow.onresizeがあると横幅が異常に広がってしまうので削除した。

なんとなくokぽい感じがしないでもないけど
上下marginがあると拡大したままになってしまうのよね、これ。

縦のスクロールも伸びっぱなしでした。
ん~もうちょっと頑張らないと使い物にならないかなぁ。

  • このエントリーをはてなブックマークに追加
  • LINEで送る

SNSでもご購読できます。

コメント

  1. Morry より:

コメントを残す


You can add images to your comment by clicking here.