DOMANDA JQUERY cronologia esecuzione funzioni

[Baio84]

Io ho creato 4 funzioni che vengono richiamate tutte in un'altra funzione, e quest'ultima viene eseguita al caricamento della pagina. Il problema è che le funzioni vengono eseguite in contemporanea, mentre io vorrei che venissero eseguite una di seguito all'altra, come se fossero in modalità callback, perché ogni funzione interagisce con degli elementi che vengono creati dalla precedente. Posto un po' di codice anche se in maniera molto semplificata. Spero di essere stato chiaro :patpat:

function alfa() {	...
};


function beta() {
	...
};


function delta() {
	...
};


function gamma() {
	...
};


function tutteequattro(){
	alfa();
        beta();
        gamma();
        delta();
};




$(document).ready(function(){
	tutteequattro();
});

 

[Mursey]

Il codice che hai scritto e' praticamente puro javascript e quindi dovrebbero essere eseguite in sequenza.

 

[Baio84]

Hai ragione, ma semplificando troppo il codice forse ti ho portato sulla strada sbagliata.
Intanto spiego meglio cosa voglio fare. E' una sorta di slideshow di immagini. Ho due immagini caricate, una ad opacità 1 e l'altra ad opacità 0. Inverto questi parametri per far scomparire l'una e comparire l'altra. Cancello quella nascosta, ne aggiungo una nuova, e alla fine centro le immagini. Sono arrivato alla conclusione che le funzioni vengono attivate nello stesso momento perché l'immagine che deve svanire, non fa in tempo e in pratica scompare in quanto viene cancellata e l'immagine che viene aggiunta non viene centrata perché la funzione che centra le immagine non riesce a prelevare in tempo i dati dell'immagine stessa, in quanto vengono attivate nello stesso momento.
Nel codice completo che ora posto, ho risolto con la funzione setTimeout, però mi sembra una soluzione poco ottimizzata

function scambiaimmagini() {	$("#contenitore img:first-child").animate({
		opacity: '0'
	});
	$("#contenitore img:last-child").animate({
		opacity: '1'
	});
};




function centraimmagine(lunghezza, altezza, marginesinistro, marginealto) {
	$("#contenitore img").each(function(){
		var immagalte = $(this).height();
		var immaglung = $(this).width();
		var proporz = immagalte * lunghezza / immaglung;
		if(proporz <= 310)
		{
			$(this).css({width: lunghezza+'px', marginLeft: marginesinistro+'px'});
			var newalte = $(this).height();
			newalte = (350 - newalte) / 2;
			$(this).css({marginTop: newalte + 'px'});
		}
		else
		{
			$(this).css({height: altezza+'px', marginTop: marginealto+'px'});
			var newlung = $(this).width();
			newlung = (400 - newlung) / 2;
			$(this).css({marginLeft: newlung + 'px'});
		}
	});
};




function cancellaimmagine() {
	$("#contenitore img:first-child").remove();
};




function inserisciimmagine(n) {
	var immagine = ["cat1.jpg", "cat2.jpg", "cat3.jpg"];
	var newimmagine = '<img src="'+immagine[n]+'" class="immagine" style="opacity: 0; position: absolute; width: 350px;" />';
	$("#contenitore").append(newimmagine);
};




function gallery(n){
	setTimeout(function(){scambiaimmagini()}, 50);
	setTimeout(function(){cancellaimmagine()}, 1000);
	setTimeout(function(){inserisciimmagine(n)}, 1050);
	setTimeout(function(){centraimmagine(350,310,25,20)}, 1100);
};




$(document).ready(function(){
	var contatore = 2;	
	setInterval(function(){
		gallery(contatore);
		if(contatore == 2)
			contatore = 0;
		else
			contatore++;
		
	}, 5000);


});

 

[francesco9696]

Non ho letto tutto il codice, ma mi vengono in mente due possibili soluzioni:
1- Smanettare la funzione queue di jquery (anche se non sono sicuro)
2- Mettere un argomento in più nella funzione che determina se chiamare un'altra funzione come callback. Questo lo puoi fare mettendo un if nel callback delle funzioni. Ad esempio metti

function alfa(a,b,c,d){
...
callback = function(){
If (a==1){
alfa(...);
}
If (b==1){
Beta(...);
}
If (c==1){
Gamma(...);
}

Puoi usare un solo parametro per determinare tutti e quattro gli argomenti, mettendo una sola variabile che assume il valore del binario abcd in decimale.
Poi puoi invece stabilire delle sequenze prestabilite di funzioni, ad esempio... Se vuoi le funzioni in ordine alfa, beta, delta, gamma, e questa la chiami sequenza 1, puoi mettere nel callback della funzione alfa un switch che se assume valore 1 l'argomento sequenza, allora chiama la funzione beta. Allo stesso modo nel callback di beta uno switch che se l'argomento è uno, chiama la funzione delta. Stessa cosa per delta, mentre per gamma in questo caso lo switch non deve fare nulla.
Avrai quindi uno schema alfa(1)->beta(1)->delta(1)->gamma(1).