マウスオーバー機能とマウス放置機能は、ウィンドウのサイズを変更すると機能し続ける

Question

ユーザーにカーソルを置いたときにメニューを表示したい。ウィンドウサイズがここ

977を下回った場合しかし、私はホバーがなくなってほしい私のコードは次のとおりです。

$(document).ready(function() { 
$(window).on("load resize", function(event){ 
    var windowSize = $(window).width(); 
    var timer; 
    if (windowSize >= 977) { 
     $(".crmUser, .userMenu").on("mouseover", function() { 
      clearTimeout(timer); 
      openSubmenu(); 
     }).on("mouseleave", function() { 
      timer = setTimeout(
       closeSubmenu 
      , 800); 
     }); 

     function openSubmenu() { 
      $(".userMenu").addClass("userOpen").fadeIn("fast"); 
     } 
     function closeSubmenu() { 
      $(".userMenu").removeClass("userOpen").fadeOut("fast"); 
     } 
    } else { } 
    }).trigger("resize");  
}); 

私もfiddleをしたが、窓がdoesntの仕事をリサイズ。

$(document).width(); 

の代わりに：： 私は..

Answer 1

使用私が行方不明です何かわからない

$(window).width(); 

とイベントのコールバック（mousehover）内の条件$(document).width()>=977を使用します。

$(".crmUser, .userMenu").on("mouseover", function() { 
     if($(document).width()>=977){ 
      clearTimeout(timer); 
      openSubmenu(); 
     } 

    }) 

Answer 2

私はこのよく働いた

$(document).ready(function(e) { 
 
    var oreientedWidth = document.body.clientWidth; 
 
\t if(oreientedWidth < 767){ 
 
\t //use your code here 
 
\t } 
 
});