javascript - 如何在 CSS 中延长悬停持续时间

Question

a:hover + #menu {
display: block;
position: fixed;

这是我的 hover 的 css，它应该显示一个菜单。但是当我移开鼠标时它会立即消失，我该怎么办？通过 JS 执行此操作会更好吗？我将如何处理？

这是此菜单的 div。它是 td 的一部分，td 是主表的一部分，而主表是网站的主要部分

<div id="menu">
   <button><a href="#igradesno1">COD WW2</button>
   <button><a href="#igra2levo">Destiny 2</button>
   <button><a href="#wolfensteindesno">Wolfenstein</button>
   <button><a href="#forhonor1">For Honor</button>
   <button><a href="#fifa182">Fifa 18</button>



 </div>

Answer 1

不要使用 display: block 和 none，尝试使用不透明度和 CSS 过渡。

我创建了一个简单的 JSfiddle 来演示

https://jsfiddle.net/3q0v5ufh/