我的想法是用jquery监控mouseover事件,然后这是设置菜单为show。当mouseout时间触发就隐藏。但是这里的一个问题是,当从导航栏移向下拉菜单是,由于mouseout时间触发,下拉菜单就失效了。请问下自动弹出的下拉菜单一般是怎么实现的,求给一个代码例子?
<meta charset="UTF-8" />
<div class="menubar">
<div class="menuitem">
<div>菜单1</div>
<div class="submenu">
<div>子菜单1</div>
<div>子菜单2</div>
</div>
</div>
<div class="menuitem">
<div>菜单2</div>
<div class="submenu">
<div>子菜单1</div>
<div>子菜单2</div>
<div>子菜单3</div>
</div>
</div>
<div class="menuend"></div>
</div>
<p>
lsjflsjlajlsa;djflqjwwlejrflsjdlfjwqoo;lnsdl;fgnsl;rjwjeflsdjfljl;jfowei
</p>
<style type="text/css">
.menubar
{line-height: 24px;}
.menubar .menuend
{clear: both;}
.menuitem
{background: #fff; border: 1px solid #c00; position: relative; float: left; margin-right: 1em;}
.menuitem .submenu
{background: #ccc; border: 1px solid #00c; position: absolute; top: 25px; left: -1px; width: 5em;}
/** 下面的控制显示和隐藏 **/
.menuitem .submenu
{display: none;}
.menuitem:hover .submenu
{display: block;}
</style>
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。