lundi 27 juillet 2020

mouseover image stuck in loop

I have been making this JavaScript code to display multiple images in one frame on mouse over.

But I get stuck in the setInterval loop and the images keep on changing although I exited the frame.

It is definitely stuck in the function change().

I can not find a way to exit this as I move my cursor.

Could you give me a hand?


let start = 0;

const imageChange = document.querySelector(".image");

imageChange.addEventListener("mouseover", set_time);
imageChange.addEventListener("mouseout", end);

function set_time() {
  setInterval(change, 1500);
}

function change() {
  if (start < 3) {
    console.log(start);
    imageChange.src = "/img/image" + start + ".jpg";
    start++;
  } else {
    start = 0;
  }
}

function end() {
  start = 0;
  imageChange.src = "/img/image" + start + ".jpg";
}

Aucun commentaire:

Enregistrer un commentaire