鼠标放在导航的文字上也会消失,是因为碰到了dl元素吗,怎么样可以碰到字也不会消失,用z-index的话 导航的链接是不是就点不到了

来源:2-7 实现垂直菜单

weixin_慕村1291783

2020-11-16 17:06:28

# 具体遇到的问题

# 报错信息的截图

# 相关课程内容截图

# 尝试过的解决思路和结果

# 粘贴全部相关代码,切记添加代码注释(请勿截图)

(function() {

    var ul = document.getElementById('banner-nav-ul');

    var lis = ul.children;

    // console.log(lis);

    var meaus = ul.nextElementSibling.children;

    // console.log(meaus);

    ul.onmouseover = function(e) {

        if (e.target.tagName.toLowerCase() == 'li') {

            for (var i = 0i < meaus.lengthi++) {

                var a = meaus[i].getAttribute('data-t');

                if (e.target.getAttribute('data-t'== a) {

                    meaus[i].className = 'menu current';

                } else {

                    meaus[i].className = 'menu';

                }

            }

        }


        // console.log(e.target.getAttribute('data-t'));


    }

    ul.onmouseout = function() {

        for (var i = 0i < meaus.lengthi++) {

            meaus[i].className = 'menu';

        }

    }

})();


写回答

1回答

好帮手慕久久

2020-11-16

同学你好,onmouseout也支持事件冒泡,即鼠标移入ul内的任一子元素,都会触发该事件。所以鼠标移入文字所在的em标签也会让列表消失。建议将事件换成onmouseleave,该事件不支持事件冒泡,只有鼠标移出ul时才能触发该事件,如下:

http://img.mukewang.com/climg/5fb254a00939eed107290178.jpg

祝学习愉快!

0

0 学习 · 15276 问题

查看课程