Mouseenter和Mouseleave下拉菜单

Question

我试图让此下拉菜单在鼠标悬停时显示子菜单，并且在子菜单顶部时也保持悬停，但是当鼠标离开时，我希望它隐藏它。

以下链接，我只能将javascript更改为mouseenter，但是我不知道如何创建mouseleave函数。

对于任何会编码的人来说，这可能都超级容易，但我却不懂（（

以下是链接：https://codepen.io/ok2ju/pen/MwyvWY

这是代码：

document.querySelector('.mini-photo-wrapper').addEventListener('mouseenter', function() {
  document.querySelector('.menu-container').classList.toggle('active');
});