Muoseenter e mouseleave si attivano continuamente

Salve a tutti.

Ho un problema che sembra abbiamo avuto altri guardando nel WEB, ma le soluzioni proposte in quei casi non risolvono il mio.

Allora, ho una normale tabella in cui in una td è inserita un'immagine (questo per ogni tr della tabella stessa). Tramite un semplice codice JS io avvicino un div alla td e in esso creo una preview più allargata dell'immagine. L'attivazione del div avviene tramite la funzione muoseenter, la chiusura dello stesso, tramite muoseleave. In teoria tutto bene, ma (come si specifica in inglese) avviene un continuo triggering tra le due funzioni, e la div non appare mai. Questa la parte HTML della td all'interno della table:

<td data-th="immagine: " class="immTd">
   <img src=" aaa.png">
</td>

mentre, vicino al footer c'è il div che crea la finestra di preview:

<div id="imgBox" style="">
    <span>
      <img src="" alt="">
    </span>
  </div>

Queste le parti CSS:

.immTd img{
  width: 80px!important;
  border: 0;
  cursor: zoom-in;
}

#imgBox{
  position: absolute;
  width: 400px;
  height: auto;
  bottom: 0;
  left: -2000px;
  background-color: transparent;
  opacity: 0;
  z-index: 1000;
  transition: opacity 0.5s ease-in-out;
}
#imgBox span{
  width: 100%;
  height: auto;
  border: 1px dashed black;
  background-color: #d5d75a;
  display: block;
}
#imgBox img{
  border-width: 0;
  padding: 5px;
  /* width: 70%;
  height:auto; */
}

Infine, questo il codice JS:

let tableImgs = document.querySelectorAll('.immTable td img');
  if (tableImgs) {
    popup = document.getElementById('imgBox');
    for (let i = 0; i < tableImgs.length; i++) {
      tableImgs[i].addEventListener('mouseenter', (event) => {

        popup.querySelector('img').setAttribute('src', tableImgs[i].src);

        popup.style.top = getCoord(tableImgs[i]).top - getPos(popup).height - 25 + 'px';

        popup.style.left = (getPos(tableImgs[i]).left - 150) + 'px';
        popup.style.opacity = 1;

      });
      tableImgs[i].addEventListener('mouseleave', (event) => {

        popup.style = '';
      });
    }
  }

Qualcuno sa gentilemente spiegarmi perché quando il cursore entra su un'immagine, avviene in continuazione la sequenza muoveenter e mouseleave?