B-Teck!

お仕事からゲームまで幅広く

【JavaScript/IE】ウインドウサイズの変更に合わせて要素を拡大縮小する

onresize時に現在のウインドウサイズ変更の比率に合わせてドキュメントの拡大率を動的に変更する。
動作確認はIEのみで、他ブラウザでは正常に動作しないかも。

(function(){
    window.addEventListener("resize",windowZoom, false);
    //ウインドウオープン時のデフォルトサイズ
    var defaultSizeH = document.documentElement.scrollHeight || document.body.scrollHeight;
    var defaultSizeW = document.documentElement.scrollWidth || document.body.scrollWidth;

    /**
    * windowZoom
    * ウインドウの拡大率を変更する
    * @return {boolean} true
    */
    function windowZoom() {
        var sizeRatioH = window.innerHeight / defaultSizeH;
        var sizeRatioW = window.innerWidth / defaultSizeW;

        var windowRatio = sizeRatioH > sizeRatioW ? sizeRatioW : sizeRatioH;
        document.body.style.zoom = windowRatio * 0.95;
        return true;
    }
})();

【JavaScript/IE】ファンクションキーを無効化する

onload時にイベントを無効化することでファンクションキーを動作しないようにできる。
押下時の処理を別で定義することで、Webアプリケーションでもファンクションキーを用いたデスクトップアプリケーションライクな処理を再現できる。
動作確認はIEのみで、おそらく他ブラウザでは正常に動作しない。

(function() {
    // keydownイベントに、Ev_KeyDown関数を登録
    // helpイベントはreturn falseで無効にする
    window.onkeydown = Ev_KeyDown;
    window.onhelp = function() {return false;};

    /**
     * Ev_KeyDown
     * デフォルトのキーダウンイベントを無効化する
     * @param なし
     * @return {boolean} false
     */
    function Ev_KeyDown() {
        // F1-F12キーであれば、無効化する(F1キー:112,... F12キー:123)
        if(event.keyCode >= 112 && event.keyCode <= 123)
        {
            event.keyCode = null;
            event.returnValue = false;
            
            //ファンクションキーに機能をもたせたい場合、下記キーコードで分岐
            //switch(code){
            //     // F1
            //     case 112:
            //         break;
            //     // F2
            //     case 113:
            //         break;
            //     // F3
            //     case 114:
            //         break;
            //     // F4
            //     case 115:
            //         break;
            //     // F5
            //     case 116:
            //         break;
            //     // F6
            //     case 117:
            //         break;
            //     // F7
            //     case 118:
            //         break;
            //     // F8
            //     case 119:
            //         break;
            //     // F9
            //     case 120:
            //         break;
            //     // F10
            //     case 121:
            //         break;
            //     // F11
            //     case 122:
            //         break;
            //     // F12
            //     case 123:
            //         break;
            //     default:
            //         break;
            // }
            
            //falseを返さないと動いてしまう
            return false;
        }

    }
})();