Rendi più semplice il codice jQuery

Question

Mi chiedevo se qualcuno avesse qualche idea su come rendere il mio codice più snello, quindi non è così pesante.

var t; 
 
$(".sn-fresh").mouseenter(function() { 
 
    $(".um-cat").hide(); 
 
    clearTimeout(t); 
 
    $("#ultra-menu, #um-fresh").fadeIn(600); 
 
}); 
 

 
$(".sn-salt").mouseenter(function() { 
 
    $(".um-cat").hide(); 
 
    clearTimeout(t); 
 
    $("#ultra-menu, #um-salt").fadeIn(600); 
 
}); 
 

 
$(".sn-shoot").mouseenter(function() { 
 
    $(".um-cat").hide(); 
 
    clearTimeout(t); 
 
    $("#ultra-menu, #um-shoot").fadeIn(600); 
 
}); 
 

 
$(".sn-eques").mouseenter(function() { 
 
    $(".um-cat").hide(); 
 
    clearTimeout(t); 
 
    $("#ultra-menu, #um-eques").fadeIn(600); 
 
}); 
 

 
$(".sn-cloth").mouseenter(function() { 
 
    $(".um-cat").hide(); 
 
    clearTimeout(t); 
 
    $("#ultra-menu, #um-cloth").fadeIn(600); 
 
}); 
 

 
$(".sn-brand").mouseenter(function() { 
 
    $(".um-cat").hide(); 
 
    clearTimeout(t); 
 
    $("#ultra-menu, #um-brand").fadeIn(600); 
 
}); 
 

 
$("#ultra-menu").mouseleave(function() { 
 
    clearTimeout(t); 
 
    t = setTimeout(function() { 
 
    $("#ultra-menu, .um-cat").fadeOut(600); 
 
    }, 300); 
 
}); 
 
$("#main-navigation a").mouseleave(function() { 
 
    clearTimeout(t); 
 
    t = setTimeout(function() { 
 
    $("#ultra-menu, .um-cat").fadeOut(600); 
 
    }, 300); 
 
}); 
 
$("#ultra-menu").mouseenter(function() { 
 
    clearTimeout(t); 
 
    $("#ultra-menu").fadeIn(600); 
 
});

Answer 1

È possibile rendere più DRY, eliminando il codice ripetuto:

var names = ["fresh","salt","shoot","eques","cloth","brand"]; 

names.forEach(function(name){ 
    $(".sn-"+name).mouseenter(function() { 
    $(".um-cat").hide(); 
    clearTimeout(t); 
    $("#ultra-menu, #um-" + name).fadeIn(600); 
    }); 
}); 

e:

$("#ultra-menu, #main-navigation a").mouseleave(function() { 
    clearTimeout(t); 
    t = setTimeout(function() { 
    $("#ultra-menu, .um-cat").fadeOut(600); 
    }, 300); 
}); 

o:

var menus = [ "#ultra-menu", "#main-navigation a" ]; 

menus.forEach(function(menu){ 
    $(menu).mouseleave(function() { 
    clearTimeout(t); 
    t = setTimeout(function() { 
     $("#ultra-menu, .um-cat").fadeOut(600); 
    }, 300); 
    }); 
}); 

Answer 2

Ecco cosa vorrei fare.

$(".sn-fresh").mouseenter(yourfunction(e); 
function yourfunction(){ 
$('.um-cat').hide(); 
clearTimeout(t); 
$('#ultra-menu', #'+e.target.id).fadeIn(600); 
} 

Con questo metodo si esegue dinamicamente la dissolvenza con il nome del genitore target.