Остановите вызов функции после ее выполнения
На моем пути 4 лошади. [^]
Я нажимаю старт, и лошади должны завершить круг. Мне удалось заставить их завернуть за первый угол и остановиться на втором углу вот так [^]
Вот мой код для белой лошади, моя проблема в том, что функции постоянно вызывают друг друга, и из-за этого я не могу обойти второй угол из - за того, что" positionTop >= window.innerHeight * 0.85-50 " работает и мешает лошади идти влево
var interval = 0; function startRace() { var raceTimer = setInterval(100); var raceActive = true; loop(); } function loop() { interval = setInterval(horse1, 10); interval = setInterval(horse2, 10); interval = setInterval(horse3, 10); interval = setInterval(horse4, 10); } function horse1() { var horse1 = document.getElementById('horse1'); var positionLeft = horse1.offsetLeft; var positionTop = horse1.offsetTop horse1.className = 'horse runRight' if (positionLeft >= window.innerWidth * 0.84 - 50){ horse1down(); } else { horse1.style.left = positionLeft + 1 + 'px'; } } function horse1down() { var horse1 = document.getElementById('horse1'); var positionTop = horse1.offsetTop; horse1.className = 'horse runDown' if (positionTop >= window.innerHeight * 0.85 - 50){ horse1left() } else { horse1.style.top = positionTop + 1 + 'px'; } } function horse1left() { var horse1 = document.getElementById('horse1'); var positionLeft = horse1.offsetLeft horse1.style.left = positionLeft - 1 + 'px'; horse1.className = 'horse runLeft' } function myLoadFunction() { var startButton = document.getElementById('start'); startButton.addEventListener('click', startRace); } document.addEventListener('DOMContentLoaded', myLoadFunction);
Что я уже пробовал:
Я пробовал четкие интервалы, но, возможно, делаю это неправильно.
function horse1down() { var horse1 = document.getElementById('horse1'); var positionTop = horse1.offsetTop; horse1.className = 'horse runDown' if (positionTop >= window.innerHeight * 0.85 - 50){ horse1left() clearInterval(interval); interval = setInterval(horseleft, 10); } else { horse1.style.top = positionTop + 1 + 'px'; } }