Question

我有一个下拉菜单，当单击父菜单时，它会出现在滑块上方。但是，当我尝试将鼠标悬停在下拉菜单的子菜单上时，它会移到滑块后面。我目前为bcoz和ve索引值都设置了-ve z-index值，因此无法正常工作，并在滑块后面显示了下拉菜单。

.owl-carousel {
    z-index: -600 !important;
}
.site-header .top-header-right .content-bot ul li:hover .top-area-sub-menu{
    display: block !important;
    width:100%;
    z-index: -500 !important;
}

Answer 1

我不确定，但是尝试一下，我认为它可以帮助您

.owl-carousel {
        z-index: 1 !important;
    }
    .site-header .top-header-right .content-bot ul li:hover .top-area-sub-menu{
        display: block !important;
        width:100%;
        z-index: 123 !important;
        position: relative;
    }

Answer 2

解决了问题。我将z-index应用于错误的滑块元素。

.main-slider {  /* correct */
    z-index: -600;
}

.owl-carousel {  /* wrong element */
        z-index: 1 !important;
}

悬停在下拉菜单上时，下拉菜单消失在滑块后面

2 个答案: