Newsgroup: it.comp.lang.javascript
Titolo: "concatenare" due funzioni setInterval()

vorrei realizzare una cosa del genere:
- una sorta di contatore fa vedere una sequenza di numeri che scorrono
rapidamente, diciamo da 1 a 50, un numero ogni 200 msec;
- arrivati a 50 ci si ferma, si fa una qualche animazione qualsiasi
(che ne so, pure 3-4 fadeOut-fadeIn uno appresso all'altro) e si
ricomincia da capo.
separatamente riesco a fare le due cose, ovvero riesco a fare un
contatore che frulla da 1 a 50 e ricomincia, oppure riesco a fare
l'animazione finale.
quello che non riesco è fare le due cose una di seguito all'altra.
a dire il vero riesco, nella prima "cosa", arrivati a 50, a fare
un'animazione, ma questa deve durare esattamente il tempo impostato
nel setInterval, se no succedono cose strane (l'effetto si
"ripercuote" quando ricomincia il ciclo), mentre a me serve che
l'animazione sia ben più lunga di 200 msec.
consigli?
grazie.



Perché non posti quello che hai fatto?
In generale, potresti fare un qualcosa del tipo:
function contatore(i) {
	//scrivi il valore
	i++;
	if(i<50) {
	 setTimeout("contatore("+i+")",250);
	 return;
	}
	//terminato il contatore
 	tuafunctionanimazione();
}
function tuafunctionanimazione() {
	//esegui quello che devi fare
	contatore(50);
}
Stesso ragionamento per setInterval (dovrai salvarti il riferimento in 
una var globale, se arriva a 50 usi clearInterval per stopparlo)

 	contatore(50);
contatore(0); //ovviamente ...

 Perché non posti quello che hai fatto?
perché mi imbarazza... :-)
modificando un po' il mio codice coi tuoi suggerimenti ho fatto una
cosa del genere:
		var id_contatore; //globale
		$(function() {
			id_contatore = setInterval("contatore()", 1000);
		});
		function contatore() {
			var i = $("#contatore").html(); //prendo i dal contenuto del div
contatore, =0
			i++;
			if(i >= 5) { //diminuito a 5 per non perdere tempo
				//terminato il contatore
				tuafunctionanimazione();
				return;
			}
			//scrivi il valore
			$("#contatore").text(i);
		}
		function tuafunctionanimazione() {
			clearInterval(id_contatore);
			//esegui quello che devi fare
			$("#contatore").css("color", "white");
			$("#contatore").css("backgroundColor", "green");
			$("#contatore").fadeOut().fadeIn();
			$("#contatore").fadeOut().fadeIn();
			id_contatore = setInterval("contatore()", 1000);
		}
sostanzialmente il tutto si ferma a 4 (e posso capirlo), ma il fadeIn-
FadeOut continua indefinitamente (e questo già non lo capisco più)

 FadeOut continua indefinitamente (e questo già non lo capisco più)
Manca una cosa: dove è che azzeri i ? i deve tornare a 0 (zero) ...


ok, grazie.  alla fine dovrei esserci riuscito con una cosa del
genere:
	<script type="text/javascript">
		var id_contatore;
		var id_aspetta;
		$(function() {
			riavviaContatore();
		}); // fine $ function
		function contatore() {
			var i = $("#contatore").html();
			i++;
			//scrivi il valore
			$("#contatore").text(i);
			if(i >= 50) {
				//terminato il contatore
				tuafunctionanimazione();
				return;
			}
		}
		function tuafunctionanimazione() {
			clearInterval(id_contatore);
			//esegui quello che devi fare
			$("#contatore").css("color", "white");
			$("#contatore").css("backgroundColor", "green");
			$("#contatore").fadeOut().fadeIn();
			$("#contatore").fadeOut().fadeIn();
			setTimeout("riavviaContatore()", 5000);
			return;
		}
		function riavviaContatore() {
			$("#contatore").css("color", "black");
			$("#contatore").css("backgroundColor", "transparent");
			$("#contatore").text(0);
			id_contatore = setInterval("contatore()", 100);
		}
	</script>