이 JavaScript 코드를 작성하여 마우스 오버시 한 프레임에 여러 이미지를 표시했습니다.
하지만 setInterval 루프에 갇히고 프레임을 종료해도 이미지가 계속 변경됩니다.
그것은 확실히 기능에 갇혀 있습니다 change()
.
커서를 움직여 나가는 방법을 찾을 수 없습니다.
손 좀 주 시겠어요?
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";
}
clearInterval
함수의 연속 실행을 중지하려면를 사용해야 합니다.
let intvl;
function set_time() {
intvl = 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;
clearInterval(intvl);
imageChange.src = "/img/image" + start + ".jpg";
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다