Ir para conteúdo

POWERED BY:

Arquivado

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

danielswater

"desacelerar" setInterval gradativamente

Recommended Posts

fala pessoal beleza?

to fazendo um scriptzinho aqui que gera imagem randomica, mas precisava que o setInterval fosse desacelerando gradativamente ate parar

 

vejam como estou fazendo:

 

$(function(){

var img = ["1.jpg","2.jpg","3.jpg","4.jpg"];
var i = 0;

$("#imagem").click(function(){

	var intervalo = window.setInterval(function(){
		if(i >= img.length)
			i = 0;
			$("#imagem").attr('src',img[i++]);

		},150);

		window.setTimeout(function(){

			clearInterval(intervalo);
			var n = Math.floor(Math.random()*img.length);
			$("#imagem").html('src',img[n]);

			},3000);

	});

});

 

alguma luz?

Compartilhar este post


Link para o post
Compartilhar em outros sites

Uma forma que vejo de fazer isso é colocar o tempo do timeout em uma variavel, e diminuir a mesma conforme a função for sendo executado, ex:

 

(function( $ ){

  var img = ['1.jpg', '2.jpg', '3.jpg', '4.jpg'],
      i = 0,
      loopTime = 150,
      timeout;

   $( '#imagem' ).on( 'click', function( evt ){

       var $this = $( this ),
           changeImgSrc = function(){
               if( i >= img.length )
                   i = 0;
               $this.attr( 'src', img[i++] );
               executeTimeout();
           },
           executeTimeout = function(){
               loopTime--;
               console.log( loopTime );
               timeout = setTimeout( changeImgSrc, loopTime );
           };

       executeTimeout();

       setTimeout( function(){
           clearTimeout( timeout );
           var n = Math.floor( Math.random() * img.length );
           $this.attr( 'src', img[n] );
       }, 3000 );
  });

}( jQuery ));

 

Online: http://jsfiddle.net/JCMais/jCCgs/

 

Abra o console javascript e verá que o tempo diminuirá, porém não chegará à zero devido o timeout ser interrompido.

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.