鼠標懸停功能和鼠標滾輪功能在調整窗口大小時保持工作狀態

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，但窗口大小調整不工作在那裏。 我不知道我錯過了什麼..

Answer 1

用途：

$(document).width(); 

相反的：

$(window).width(); 

和使用條件$(document).width()>=977事件的回調（mousehover）內：

$(".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 } 
 
});