javascript - 如何在媒体查询中停止 Jquery 悬停？

Question

我创建了一个带有 jquery 悬停效果的导航。

导航有效，唯一的问题是当您将屏幕设置为 800 像素或更少并按下红色框以显示切换导航时。悬停菜单正在从全宽菜单中选择 jquery。

如何阻止 jquery 悬停菜单不选择主菜单的悬停状态。

http://jsfiddle.net/n8zqS/2/

/*  MAIN MENU DROPDOWN
===================================*/
$("#toggle-nav").click(function () {
    $("#nav").slideToggle('slow');
});
/*  MAIN SETTINGS SHOW AND HIDE
===================================*/

$("#user-profile").hover(function(){
    $('.tabs').fadeToggle();
});

Answer 1

Just check the width of the browser in your hover handler:

$("#user-profile").hover(function(){
    if ( $(window).width() > 800 ) $('.tabs').fadeToggle();
});