How to make the menu not hidden?

Hello. There is a menu That when the mouse falls out. Made with jquery
/* function for dropdown menu */
(function(){
 var $headerNavItem = $('.header__navItem.sub').children('a'),
 $headerNavSublist = $('.header__navSubList');

 if (window.matchMedia('(min-width: 768px)').matches) {

$headerNavItem.hover(function(){
$(this).next().slideDown(400);
 }, function(){
$(this).next().slideUp(400);
 }); 

 } else {
$headerNavItem.unbind();
}

$(window).resize(function(){

 if (window.matchMedia('(min-width: 768px)').matches) {
$headerNavItem.hover(function(){
$(this).next().slideDown(400);
 }, function(){
$(this).next().slideUp(400);
 }); 
 } else {
$headerNavItem.unbind();
}

});

})();
 /* function for dropdown menu End */

But there is one problem. When leaving the cursor of the menu item the submenu is hidden. How to avoid it by means of jQuery? Please do not advise to make such a menu to css:)
July 2nd 19 at 14:03
1 answer
July 2nd 19 at 14:05
Solution
Attach :hover to the parent element of Your submenu, not the link

Find more questions by tags HTMLCSSjQuery