第一个菜单项被选中

Question

问题：

我有，当你将鼠标悬停在父项应该显示的第一个项目的菜单。 例如，当你悬停'皮艇&独木舟'应该突出显示第一项2+人，并显示在右侧的内容。

你也应该能够悬停在船上，右侧的内容应该改变。应该默认选择休闲娱乐，但你也应该能够在钓鱼上徘徊。

目前它不显示第一项，但你可以悬停在任何项目上，它会显示出来。

我试过了什么？

$(document).ready(function() { 
    //on hover of sub menu li then highlight itself 
    $('div#new-menu-lower ul.menuul li.menuli').hover(

    function() { 

     $(this).children('div#new-menu-lower ul li ul').css("display","block"); 
     $('div#new-menu-lower ul li ul li ul:first').css("display","block"); 
     $('div#new-menu-lower ul li ul li').css("display","block"); 
     $('div#new-menu-lower ul li ul li ul li:first').css("display","block"); 
     $(this).children('div#new-menu-lower ul li ul li ul').css("display","block"); 

    }, function() { 

     $(this).children('div#new-menu-lower ul li ul').css("display","none"); 
     $('div#new-menu-lower ul li ul li ul:first').css("display","none"); 
     $('div#new-menu-lower ul li ul li:first').css("display","none"); 
     $('div#new-menu-lower ul li ul li ul li:first').css("display","none"); 
     $(this).children('div#new-menu-lower ul li ul li ul').css("display","none"); 

    }) 
}); 

的jsfiddle： http://jsfiddle.net/NDMuu/7/

我会使用伪类:hover接受纯CSS的解决方案，如果你能得到它的工作，否则我认为jQuery的/ JS是要走的路？

* 编辑： *更新了我的描述略有

Answer 1

拿到的第一个项目，默认情况下显示的方式是使用if声明，宣称：如果父列表项是display: block那么它也将是的。当你将鼠标悬停在另一个上面时，你只需要告诉其他项目是display: none。我没有时间修复所有代码，但这是从哪里开始的。给那一枪，然后我会帮你完成它。