functionsaufruf mit setTimeout scheitert

[Blackthorne]

Einen wunderschönen Abend,
möchte gerne eine Funktion schreiben, die Langsam einen div einblendet.
Habe mir das hier überlegt

  
	function fadeIn(opacity){  
		if(opacity < 1){  
			$('design').setOpacity(opacity);  
			opacity =+0.1;	  
			alert(opacity);  
			setTimeout(fadeIn(opacity),10000)  
		}  
	}  

wobei die Funktion dann meistens 0 übergeben bekommt.
Das alert ist nur zu testzwecken, allerdings gibt es unedlich mal hintereinander 0.1 aus. Die Ausgabe hat auch keine Verzögerung, also die 1000 Milisekunden werden ignoriert.

Kann mir jemannd sagen was ich falsch mache???

Gruß
Blackthorne

PS:Nach längerem Suchen im Net habe ich in mehreren Einträgen gelesen, das setTimeout in schleifen nicht möglich ist, daher die rekursive Funktion.

[Vinzenz Mai]

Hallo,

bist Du Dir ganz sicher, dass Du

  

> 			opacity =+0.1;	

verwendest.

Kann mir jemannd sagen was ich falsch mache???

Vielleicht kann Kai auch Dir helfen :-)
Lesetipp: SELFHTML aktuell, Fader-Framework.

Freundliche Grüße

Vinzenz

[Blackthorne]

Hallo,

bist Du Dir ganz sicher, dass Du

»» opacity =+0.1;

> verwendest.  
>   

Ja, bin ich. Ict Copy&Paste Code oder war das irgendeine rhetorische Frage ? (grübel :-) )  
  
Das andere werde ich mir gleich mal zu Gemüte führen.  
  
Danke  
Blackthorne

[paulonkey]

Hey Blackthorne,
diese Zeile:

opacity =+0.1;

führt dazu, dass du in jedem Rekursionsschritt den Wert immer wieder auf 0.1 setzt.
Falls du inkrementieren willst, musst du += statt =+ verwenden.
Dann kann es vielleicht auch irgendwann die Abbruchbedingung erreichen...

Übrigens glaube ich, dass man setTimeout auch in schleifen verwenden kann:

for(var i = timeout; i > 0; i--) {
setTimeout("window.status='"+i+" seconds remaining'", (timeout-i)*1000);
}

funktioniert zumindest in meinem Greasemonkey-Script...ich bin mir aber nicht sicher,
ob das 100% das gleiche ist...

Paul

[Blackthorne]

Hallo zusammen,
dank Eurer Hilfe, und ein bißchen experimentieren, läuft es jetzt.

Für alle die es interessiert, hier die Funktion:

  
	function fadeIn(opacity_var,el){  
		opacity_var += 0.1;  
		if(opacity_var < 1){  
			el.setOpacity(opacity_var);  
			setTimeout(function () { fadeIn(opacity_var,el); }, 100);  
		}  
	}  

[molily]

function fadeIn(opacity){

  	setTimeout(fadeIn(opacity),10000)  

setTimeout erwartet eine Referenz auf ein Funktionsobjekt. Was du machst: Du führst fadeIn sofort aus, indem du die Klammern dahinter notierst - das ist nämlich der Funktionsausführungs-Operator.

Das ist dasselbe, als würdest du
setTimeout(window.alert("Hallo!"), 10000);
notieren.
Diese Alert wird natürlich nicht nach 10 Sekunden ausgeführt, sondern sofort, wenn der JavaScript-Interpreter diese Zeile ausführt.

Was schließlich bei setTimeout als erster Parameter ankommt, ist der Rückgabewert des fadeIn-Aufrufes - es gibt keinen.

Was du also tun musst: Eine Funktionsreferenz notieren. Dazu kannst du eine anonyme Funktion verwenden, mit der du den fadeIn-Aufruf kapselst:

setTimeout(function () { fadeIn(opacity); }, 10000);

Die Variable opacity mit dem letzten in fadeIn gesetzten Wert ist darin verfügbar, weil es sich um eine Closure handelt.

Mathias