我有以下悬停脚本来处理导航栏中子菜单的向下滑动:
$j('body').ready(function() {
$j('.menu-item').hover(function() {
$j(this).find('.sub-menu').slideDown("slow");
},
function() {
$j(this).find('.sub-menu').slideUp("slow");
});
});
目前,正如预期的那样,只要用户将鼠标悬停在 .menu-item div 上,就会激活向下滑动。但是,我只想在用户将鼠标悬停在 .menu-item div 中包含的子 div 上时激活向下滑动,即 .bottom_nav。
HTML 格式为:
<li class="menu-item">
<div class="box">
<div class="top_nav">
</div>
<div class="clear">
<div class="bottom_nav">
<div class="left_nav">
</div>
<div class="center_nav">
<a href="http://soteriabrighton.co.uk/news/">news</a>
</div>
<div class="right_nav">
</div>
</a>
</div>
</div>
<ul class="sub-menu">
<li>
<div class="box">
<div class="top_nav">
</div>
<div class="clear">
<div class="bottom_nav">
<div class="left_nav">
</div>
<div class="center_nav">
<a href="http://soteriabrighton.co.uk/news/events/">events</a>
</div>
<div class="right_nav">
</div>
</a>
</div>
</div>
</li>
</ul>
</li>
您可以在此页面上看到正在运行的导航项目,特别是在“新闻”项目上,该项目有一个事件页面的下拉菜单。由于网站正在开发中,您将需要输入以下凭据:
用户名:访客
密码:stackoverflow