CSS - 悬停时的弹簧侧边菜单

Question

我想实现一个描述并实现here的侧边菜单。我可以获得与网页上显示的几乎相同的效果，但是当菜单缩回（鼠标离开菜单表面）时，没有转换。换句话说，在我的情况下，菜单消失，而不是根据过渡期缩回。

我的CSS代码如下：

private void cancelAll() {
    for (int i = 0; i < maxPreload; i++) {
      requestManager.clear(preloadTargetQueue.next(0, 0));
    }
  }

关于我做错了什么以及为什么相同的代码在网页上工作的任何建议？

Answer 1

您需要将转换放在主div而不是悬停

@media only screen and (max-width: 50em) {
   .nav_menu {
      left: -16em;
      transition: 0.2s; 
   }

   .nav_menu:hover {
      left: 0em;

   }
}