Member 13160996 Ответов: 0

Остановите вызов функции после ее выполнения


На моем пути 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';
	}
}

0 Ответов