Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

kaiquemix

window.onscroll Bugando animação

Recommended Posts

Olá pessoal, Estou fazendo uma animação onde quando o TOP > 2800 a animação vai começar.

A animação vai fazer os numeros dentro de um UL LI aumentarem do 0 até o numero escrito.

 

BUG:

O numero as vezes sobe todo e aparece outro, ou aumenta só um pouco e quando você mexe a tela ele vai aumentando pouco a pouco.

window.onscroll = function(){
   var top = window.pageYOffset || document.documentElement.scrollTop
   if( top > 2800 ) {
  $('.spincrement').spincrement({
    from: 0,
    decimalPlaces:0 ,
    duration: 4000,
  });
   }
};

Compartilhar este post


Link para o post
Compartilhar em outros sites

O problema é que sempre que o top for maior, ele vai chamar essa função, causando varias chamadas a cada scroll quando maior que 2800.

Tente o seguinte:

1. Defina uma variavel de controle (trava).
2. Cheque se trava == true. Se nao, chama o spincrement.
3. Adicione o callback complete na função.

Ps. Se, de fato, for pra executar apenas UMA vez, remova a linha complete: func....

var trava = false;
window.onscroll = function(){
   var top = window.pageYOffset || document.documentElement.scrollTop
   if( top > 2800 && !trava) {
      trava = true;
      $('.spincrement').spincrement({
         from: 0,
         decimalPlaces:0 ,
         duration: 4000,
         complete: function() { trava = false; }
      });
   }
};

Compartilhar este post


Link para o post
Compartilhar em outros sites

 

O problema é que sempre que o top for maior, ele vai chamar essa função, causando varias chamadas a cada scroll quando maior que 2800.

 

Tente o seguinte:

 

1. Defina uma variavel de controle (trava).

2. Cheque se trava == true. Se nao, chama o spincrement.

3. Adicione o callback complete na função.

 

Ps. Se, de fato, for pra executar apenas UMA vez, remova a linha complete: func....

 

var trava = false;
window.onscroll = function(){
   var top = window.pageYOffset || document.documentElement.scrollTop
   if( top > 2800 && !trava) {
      trava = true;
      $('.spincrement').spincrement({
         from: 0,
         decimalPlaces:0 ,
         duration: 4000,
         complete: function() { trava = false; }
      });
   }
};

Sim quero que execute apenas uma vez quando chegar nesse ponto.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.