Показывать подменю только в подменю
Я пытаюсь показать подменю при наведении меню. Я преуспел в уровне подменю 1. Но когда я перехожу на уровень подменю 2 (то есть, подменю подменю), он не работает. Я хочу показывать подменю уровня 2 только при наведении на подменю уровня 1. Ниже приведен код, который я пробовал
<ul class="nav">
<li><a href="#">Home</a>
</li>
<li><a href="#">About Us</a>
<ul class="submenu">
<li><a href="#">Capabilities</a></li>
<li><a href="#">Approach</a></li>
</ul>
</li>
<li><a href="#">Careers</a>
<ul class="submenu">
<li><a href="#">Working With Us</a></li>
<li><a href="#">Work Culture</a>
<ul>
<li><a href="#">Benefits</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Resources</a>
</li>
<li><a href="#">Contact Us</a>
</li>
</ul>
Ниже приводится JQuery
$('ul.submenu').hide();
$('ul.nav > li').hover(function () {
if ($(this).find('ul.submenu').length > 0) {
$(this).find('ul.submenu').stop().slideDown('slow');
}
},function () {
if ($(this).find('ul.submenu').length > 0) {
$(this).find('ul.submenu').stop().slideUp('slow');
}
});
Пожалуйста, найдите скрипку здесь:http://jsfiddle.net/Midhun28/RbY83/1/