Mouseenter 和 Mouseleave 下拉菜單

Question

我試圖讓這個下拉菜單在鼠標為 hover 時顯示子菜單，並在子菜單頂部保持 hover ，但是當鼠標離開時，我希望它隱藏它。

以下鏈接，我只能將javascript更改為mouseenter，但我不知道如何創建mouseleave function。

對於任何知道如何編碼的人來說，這可能非常容易，但我不會:(

這是鏈接： https://codepen.io/ok2ju/pen/MwyvWY

這是代碼：

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