ブラウザの拡大率、ズームレベルを取得した。

2016-05-11

ブラウザの拡大率取得は基本的に無理とされています。

今現在Firefox + Flash + JavaScriptという組みあわせではなんとか取得できます。WindowsのFirefoxで確認しました。

つまりブラウザシェアのほとんどで取得が不可能だと思われるので、拡大率で何かをどうにかしようという思いつきが口から発せられたら即座に無理ですと言いましょう。

デモ

zoomer.mmmpa.net

原理

ブラウザの拡大率を上げても、Flashの表示は拡大されないブラウザがあります。ざっとみたところFirefoxしか確認できませんでしたが、かつてはInternetExplorerもそうであった気がします。

InternetExplorer上での表示くずれをなんとかしなければならなくなり、ひねりだした記憶がかすかにあります。つらいのであまり覚えていません。

拡大されていないFlashの横幅をFlashからJavaScriptに渡し、JavaScriptは拡大された状態でのDOMの横幅を取得して、その差異から拡大率を算出します。

ソース

mmmpa/browser_zoom_level

Flash

JavaScriptを呼びます。

private function passSize():void{
    ExternalInterface.call('onResizeSWF', stage.stageWidth);
}

JavaScript

Flashから投げられたstage.stageWidthであるrawWidthと、DOMであるcontainerの横幅で計算します。

let compute = (rawWidth) => {
  let zoomedWidth = container.clientWidth;
  return rawWidth / zoomedWidth;
};

なお

業務上で使用した類似コードは今現在、WWW上で元気に動いているようです。