老师，麻烦解答一下鼠标离开主菜单区域，子菜单消失这个效果。

var index=0,//图片下标

timer=null,//定时器

pics=byId("banner").getElementsByTagName("div"),

dots=byId("dots").getElementsByTagName("span"),

prev=byId("prev"),

next=byId("next"),

len=pics.length,

menu=byId("menu-content"),

subMenu=byId("sub-menu"),

innerBox=subMenu.getElementsByClassName("inner-box"),

menuItems=menu.getElementsByClassName("menu-item");

//离开主菜单，子菜单隐藏

menu.onmouseout=function(){

subMenu.className="sub-menu hide";

}

.menu-content{

position: absolute;

left: 0;

top: 0;

padding-top:6px;

z-index: 2;

width: 244px;

height: 454px;

}

这里menu-content的height为454px，可为什么离开了最后一个menu-item子菜单就消失了？不是应该离开主菜单这个盒子的区域，子菜单才消失吗？

源自：项目：JavaScript轮播图 6-1 案例总结

收起

3回答

好帮手慕阿慧回答被采纳获得+3积分 2020-07-24 11:55:16

同学你好，左侧的灰色部分menu-content绑定了onmouseout事件。在鼠标离开灰色部分menu-content，和离开其子div区域时都会触发onmouseout事件。所以在离开了最后一个子菜单后会触发onmouseout事件，子菜单会消失。

如果我的回答解决了你的疑惑，请采纳！祝学习愉快！

加油啊豪提问者 #1

老师，你上面说的menu-box只绑定了onmouseout事件。 //离开主菜单，子菜单隐藏 menu.onmouseout=function(){ subMenu.className="sub-menu hide"; } 老师的意思是，离开menu-box和其子div区域，都会触发这个onmouseout事件，是这样吗？为什么这里离开子div区域也会触发menu-box的onmouseout时间呢？

2020-07-24 13:07:16