Jquery 롤오버가 아닌 동일한 하위 항목이 있습니까?

Question

롤오버 .mainmenu .submenu가 사라지지만, 문제는 부모와 자식이 관련이 없다는 것입니다. 커서를 움직이면 .submenu를 어떻게 보이게 할 수 있습니까? .mainmenu에서 .submenu로?

http://codepen.io/vincentccw/pen/LnvJE

my html: 
////////////////////////////////////////////// 

<div class="mainmenu">this is text</div> 
<div class="submenu">this is text2</div> 

////////////////////////////////////////////// 

my js: 
////////////////////////////////////////////// 

$(document).ready(function() { 

$(".mainmenu, .submenu").mouseenter(function(){ 
    $(".submenu").stop(true,true).slideToggle(); 
    console.log('slide down'); 
}).mouseleave(function(){ 
    $(".submenu").stop(true,true).slideToggle(); 
    console.log('slide up'); 
}); 

}); 

//////////////////////////////////////////////// 

Answer 1

$(document).ready(function() { 

$(".mainmenu").mouseenter(function() { 
    $(".submenu").stop(true, true).slideToggle(); 
    // console.log('slide down'); 
}).mouseleave(function (e) { 
    if (e.relatedTarget.className != "submenu") $(".submenu").stop(true, true).slideToggle(); 
    // console.log('slide up'); 
}); 

$(".submenu").mouseleave(function (e) { 
    $(".submenu").stop(true, true).slideToggle(); 
    // console.log('slide up'); 
}); 

}); 

http://jsfiddle.net/3bLbJ/1/