Javascript 百安居酒店；Q型导航

在B&Q最新设计的网站上，如果你将鼠标悬停在商店的导航栏上，然后在右边显示“油漆、壁纸和装饰”菜单。我想做一些类似的事情，但看看dev工具中的代码，我无法确定最终菜单是如何显示的？是通过CSS还是JS？有人能给我一些关于重新创建类似风格导航的建议吗

---

编辑：链接到网站-

尝试在该页面中使用inspect元素，并了解其制作方法

---

或者使用F12切换检查菜单

我认为这是CSS和JS的混合，检查菜单后，它看起来像一个类

。处于活动状态

将添加到父元素，即“Paint，Wallpaps…”，然后设置CSS，设置悬停子元素的样式。我认为JS再次在mouseout上删除了这个类

---

因此，基本上它只是将隐藏菜单从

display:none

切换到

display:block

悬停

尝试阅读我已经说过的内容“我想做一些类似的事情，但在开发工具中查看代码，我无法确定最终菜单是如何显示的？”尝试研究引导方法有很多样式可以切换：悬停以显示或隐藏内容，这是纯CSN不确定它只是这样做，因为隐藏菜单设置为离开屏幕（-999em），所以仅显示它不会在屏幕上显示。是的，偏移它-999em是隐藏它的另一种方式，本质上做同样的事情，得到同样的效果