4

Tentei desta forma mas não obtive sucesso. Minha intenção é fazer como um efeito da curva de Bézier.

var count = 0;

var times = 100;
var fn = function() {
  count++;
  
  if(count === 25) {
    console.log(count, times);
    times = 1000;
  }
  if(count === 50) {
    console.log(count, times);
    clearInterval(interval);
  }
  
  document.getElementById('div').style.left = count + 'px';
}

var interval = setInterval(fn, times);
#div {
  background-color: black;
  height: 100px;
  width: 100px;
  position: relative;
  left: 0px;
}
<div id="div"></div>

2 Respostas 2

5

Uma vez começado o setInterval consome os argumentos que lhe foram passados e já não volta a verifica-los.

Sugiro que uses o setTimeout pois assim ele vai ter de ser chamado novamente a cada vez que um times expirar.

var count = 0;

var times = 100;
function periodical() {
  count++;
  
  if(count === 25) {
    console.log(count, times);
    times = 1000;
  }
  if(count === 50) {
    console.log(count, times);
    return;
  }
  
  document.getElementById('div').style.left = count + 'px';
  setTimeout(periodical, times);
}

setTimeout(periodical(), times);
#div {
  background-color: black;
  height: 100px;
  width: 100px;
  position: relative;
  left: 0px;
}
<div id="div"></div>

2

A resposta do Sergio atende plenamente ao processo desejado. Entretando, para fins de esclarecimento para outros usuários com uma dúvida que corresponda plenamente ao título da questão -

Mantenha uma referência ao scheduler:

var myVar = setInterval(myTimer, 1000); // Um segundo (1000 ms) de intervalo

Quando desejar mudar a frequência, elimine o scheduler via clearInterval():

clearInterval(myVar);

Associe um novo scheduler à referência:

myVar = setInterval(myTimer, 3000); // três segundos de intervalo

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .