jquery - JQuery は、ドキュメントの準備ができたときに関数を開始し、サイズを変更します

Question

アイコンをクリックすると、左側からスライドインおよびスライドアウトするメニューを取得しようとしています。これは問題なく動作しますが、ブラウザのサイズによってメニューの動作が少し異なる必要があります。したがって、ドキュメントの準備ができてサイズが変更されたときのブラウザーの幅を知る必要があります。画面サイズに応じて正しい「onclick」機能をアクティブにしないか、複数回アクティブにします。以下のさまざまなバリエーションを試しました。誰でも助けてください。私はjsFiddleを作成しました： http : //jsfiddle.net/cDppA/42/initiate

 var menuInitialized = false;

function doMenu() {
    var width = $(window).width(); 

    if (width < 550) {

         if (!menuInitialized) {
              $('.icon-menu-2').on('click', function (event) { 
            console.log('small');
               });     
            menuInitialized = true;
         }
    } else if ((width < 800) && (width > 550)) {
        if (menuInitialized) {
             $('.icon-menu-2').on('click', function (event) { 
            console.log('large');
              });     
            menuInitialized = false;
        }
    }

}
$(document).ready(doMenu);
$(window).resize(doMenu);