JQuery условное увядание по ширине окна

Question

Я хотел бы сделать подменю fadeIn, но только над шириной окна 850 пикселей. Мой код работает только в том случае, если я обновляю страницу, но я бы хотел сделать это, когда я изменил размер окна (или изменил настройку телефона). Что не так?

function WinSize() { 
    var winwidth = $(window).width(); 
    if (winwidth > 850) { 
     $('#main-menu > ul > li').on({ 
      mouseenter: function() { 
       $(this).find("ul").fadeIn(300); 
      }, 
      mouseleave: function() { 
       $(this).find("ul").fadeOut(300); 
      } 
     }); 
    } 
} 

$(window).on("load resize", WinSize); 

Answer 1

Попробуйте скопировать условия в вашем .on. В настоящее время вы связывание события, когда на нагрузочном окне размера> 850, а не осуществление реальных .on событий

function WinSize() { 
    $('#main-menu > ul > li').on({ 
     mouseenter: function() { 
      var winwidth = $(window).width(); 

      if (winwidth > 850) { 
       $(this).find("ul").fadeIn(300); 
      } 
     }, 
     mouseleave: function() { 
      var winwidth = $(window).width(); 

      if (winwidth > 850) { 
       $(this).find("ul").fadeOut(300); 
      } 
     } 
    }); 
} 

$(window).on("load resize", WinSize);