Javascript 如何获取导航栏'；当鼠标悬停在它的内容上时，它是否会下降并停留？

我设计了一个简单的导航栏，并为其外观设计了最基本的框架。在阅读之后，当我将鼠标悬停在主元素（word）上时，我已经能够创建一个下拉列表

当我将鼠标悬停在下拉菜单上时，如何使下拉菜单保持不变

当我将鼠标悬停在下拉列表上时，我尝试使用JS将

不透明度

保持在1，但它不起作用，因为下拉列表本身基于

不透明度

，无论我最初是否将鼠标悬停在主元素上，它都会影响它，因为它不是

显示：无

另外，另一个问题是，在我的“服务器”下拉列表中，我似乎只能看到“服务器列表”，而不能看到

中的其他2个，为什么会这样

至于我为我的工作想出了什么，这是我的代码：


document.getElementById（“服务器”）.onmouseover=function（）{
serverMouseOver（）
};
document.getElementById（“服务器”）.onmouseout=function（）{
serverMouseOut（）
};
函数serverMouseOver（）{
document.getElementById（“serverdropdownbox”）.className+=“动画fadeIn”；
};
函数serverMouseOut（）{
document.getElementById（“serverdropdownbox”）.className+=“动画淡出”；
};
.clearfix{
明确：两者皆有；
}
身体
{
背景色：rgb（21,14,43）；
背景图像：url（“../images/backgroundimage.jpg”）；
背景尺寸：封面；
背景重复：无重复；
背景附件：固定；
最小高度：100%；
背景位置：中心；
溢出：隐藏；
}
#steamlogomainbox:悬停
{
宽度：12vw；
}
#gigalogo
{
宽度：26vw；
高度：8vw；
利润率：0.2vw；
填充：0；
}
#蒸汽箱
{
宽度：10.5vw；
高度：7vw；
浮动：对；
背景色：#0B0D16；/*000c21*/
-webkit剪辑路径：多边形（30%0、100%0、100%100%、0%100%）；
剪辑路径：多边形（30%0,100%0,100%100,0%100%）；
利润率：0.2vw-1vw 0；
填充：0；
溢出：隐藏；
}
#蒸汽标志
{
填料：0.7vw 0.3vw；
高度：5.6vw；
}		
#navbarbox
{
明确：两者皆有；
显示：块；
宽度：100vw；
高度：3.5vw；
填充：0vw 0；
保证金：0；
}
#导航栏，#导航栏ul
{
宽度：100vw；
高度：3.5vw；
显示器：flex；
填充：0；
保证金：0；
}
#导航栏跨度
{
高度：3.5vw；
显示：块；
变换：skewX（15度）；
}
#李国宝
{
颜色：白色；
列表样式：无；
显示：内联块；
填料：1vw 3.95vw 1vw 3.95vw；
保证金：自动；
文本对齐：居中；
颜色：红色；
字体大小：2.3vw；
字体系列：Jura；
高度：2.5vw；
变换：skewX（-15度）；
}
#服务器下拉框
{
显示：块；
不透明度：0；
浮动：左；
颜色：白色；
背景色：深蓝色；
宽度：0；
变换：skewX（15度）；
}
#服务器下拉内容
{
列表样式类型：无；
宽度：16vw；
利润率：1vw 0 10.1vw；
}
#服务器下载内容李
{
边框：1px纯白；
字体大小：25px；
文本对齐：居中；
填充：1vw 0 1vw 0；
背景色：白色；
}
#服务器
{
背景颜色：蓝色；
}
#社区下拉框
{
显示：块；
浮动：左；
颜色：白色；
背景色：深蓝色；
宽度：0；
变换：skewX（15度）；
}
#社区下拉内容
{
列表样式类型：无；
宽度：19.7vw；
利润率：1vw 0 26vw；
}
#社区下拉列表
{
边框：1px纯白；
字体大小：25px；
文本对齐：居中；
填充：1vw 0 1vw 0；
}
#社区
{
背景颜色：棕色；
}			
#存储下拉框
{
显示：块；
浮动：左；
颜色：白色；
背景色：深蓝色；
宽度：0；
变换：skewX（15度）；
}
#storedropdowncontent
{
列表样式类型：无；
宽度：13.6vw；
利润率：1vw 0 45.65vw；
}
#storedropdowncontent li
{
边框：1px纯白；
字体大小：25px；
文本对齐：居中；
填充：1vw 0 1vw 0；
}
#贮藏
{
背景颜色：蓝色；
}			
#下载下载框
{
显示：块；
浮动：左；
颜色：白色；
背景色：深蓝色；
宽度：0；
变换：skewX（15度）；
}
#下载下载内容
{
列表样式类型：无；
宽度：19.8vw；
利润率：1vw 0 59.2vw；
}
#下载下载内容李
{
边框：1px纯白；
字体大小：25px；
文本对齐：居中；
填充：1vw 0 1vw 0；
}
#下载
{
背景颜色：棕色；
}			
#触点下拉框
{
显示：块；
浮动：左；
颜色：白色；
背景色：深蓝色；
宽度：0；
变换：skewX（15度）；
}
#联系人下拉内容
{
列表样式类型：无；
宽度：16vw；
利润率：1vw 0 78.9vw；
}
#接触式下拉列表
{
边框：1px纯白；
字体大小：25px；
文本对齐：居中；
填充：1vw 0 1vw 0；
}
#接触
{
背景颜色：蓝色；
}
有生气的
{
动画持续时间：1s；
动画填充模式：两者都有；
}
@关键帧淡入淡出{
从{
不透明度：0；
}
到{
不透明度：1；
}
}
法丹先生{
动画名称：fadeIn；
}
@关键帧淡出{
从{
不透明度：1；
}
到{
不透明度：0；
}
}
.淡出{
动画名称：淡出；
}




千兆分贝
CS:GO





学分
项目
贵宾


TF2
政务司司长：开始
布雷艇


联系我们
职员
呼吁