✔ Dynamische Bilder + Fade

[janbuecker]

Hallo,

ich habe ein Array bestehend aus verschiedenen Verweisen auf Bilder. Dieses Array möchte ich nun nach und nach einfügen lassen. (Wie es auch schon funktioniert.) Was allerdings nun meine Hürde ist, ist, dass der Übergang zum nächsten Bild erst reibungslos funktioniert, danach aber immer schneller wird bis die Bilder sich ruckartig ändern. Der Fadeout lässt auch zu wünschen übrig.

Meine zweite Frage an dieser Stelle ist:
Wie könnte ich es am besten realisieren, 2 Bilder ineinander faden zu lassen, sodass ich erst garnicht auf einen Hintergrund zurückfalle? Mit 2 Ebenen bzw. Masken arbeiten?

Hier ist der Code zum Problem:

var Bilder = new XML();
Bilder.ignoreWhite = true;
Bilder.load("meine_xmlseite");

Bilder.onLoad = function(success) {
	Inhalt = Bilder.firstChild.childNodes;
	var Ausgabe:Array = new Array();
	for (var i = 1; i<=Inhalt.length; i++) {
		if (Inhalt[i].attributes.srcimage != undefined) {
			Ausgabe.push(Inhalt[i].attributes.srcimage);
		}
	}
	var x = 0;
	var z_out = 100;
	var z_in = 0;

	function fade_1() {
		if(z_in<100) {
			maske_mc._alpha = z_in;
			z_in++;
		}
	}
	function fadeout() {
		if(z_out>0) {
			maske_mc._alpha = z_out;
			z_out--;
		}
	}
	function fadeout_init() {
		maske_mc._alpha = 100;
		z_out=100;
		fadeOut_1 = setInterval(fadeout, 10);
		clearInterval(fadeoutTimer_1);
	}

	var timer1:Number = setInterval(wait, 5000);
	
	function wait() {
		if(Ausgabe[x]==undefined) {
			createEmptyMovieClip("maske_mc", 999 + x);
			maske_mc.loadMovie(Ausgabe[0]); 
			x=1;
		} else {
			createEmptyMovieClip("maske_mc", 999 + x);
			maske_mc.loadMovie(Ausgabe[x]); 
			x++;
		}
		z_in = 0;
		fadeTimer_1 = setInterval(fade_1, 10);
		fadeoutTimer_1 = setInterval(fadeout_init, 4000);
	}
}

Vielen Dank und Grüße,
Jan

 

[Tobias Menzel]

Hi,

Dein Problem wird sein, dass Du die Intervalle in der Funktion "wait" überchreibst, ohne die existieren zuvor mit clearIntervall zu entfernen.

Schau mal in diesen Thread: http://www.tutorials.de/forum/flash/287453-wie-funktioniert-eine-slideshow-mit-uberblend-effekt.html

In Post #4 habe ich einige Vorlagen verlinkt, die Dir wahrscheinlich weiterhelfen.

Gruß
.

 

[janbuecker]

Hi,

danke dir für die Antwort!

Ich habe das Problem mit der schnelligkeit etc. in den Griff bekommen. Habe nun 2 MCs angelegt, sodass diese ineinander faden. Allerdings bleibt die 2te Ebene (maske_mc2) immer über der ersten (maske_mc) und somit ruckelt wieder der ganze Übergang ohne vernümpftigen Übergang. Oder ehr gesagt so, das springt irgendwie völlig unkontrolliert.

Ausgangscode:

var Bilder = new XML();
Bilder.ignoreWhite = true;
Bilder.load("link_xml");

Bilder.onLoad = function(success) {
	Inhalt = Bilder.firstChild.childNodes;
	var Ausgabe:Array = new Array();
	for (var i = 1; i<=Inhalt.length; i++) {
		if (Inhalt[i].attributes.srcimage != undefined) {
			Ausgabe.push(Inhalt[i].attributes.srcimage);
		}
	}
	var x = 0;
	var z_out = 100;
	var z_in = 0;

	function fadeout_maske1_exec() {
		if(z_out>0) {
			maske_mc._alpha = z_out;
			z_out--;
		} else { clearInterval(fadeOut); trace("out: maske2"); }
	}
	function fadeout_maske2_exec() {
		if(z_out>0) {
			maske_mc2._alpha = z_out;
			z_out--;
		} else { clearInterval(fadeOut); trace("out: maske2"); }
	}
	function fadein_maske1_exec() {
		if(z_out<100) {
			maske_mc._alpha = z_in;
			z_in++;
		} else { clearInterval(fadeIn); trace("in: maske1"); }
	}
	function fadein_maske2_exec() {
		if(z_out<100) {
			maske_mc2._alpha = z_in;
			z_in++;
		} else { clearInterval(fadeIn); trace("in: maske2"); }
	}

	function fadeout_init(count) {
		z_out = 100;
		if(count>1) {
			maske_mc2._alpha=100;
			fadeOut = setInterval(fadeout_maske2_exec, 10);
		} else {
			maske_mc._alpha=100;
			fadeOut = setInterval(fadeout_maske1_exec, 10);
		}
	}
	function fade_init(count) {
		z_in = 0;
		z_out = 100;	
		if(count>1) {
			maske_mc2._alpha=0;
			maske_mc._alpha=100;
			fadeOut = setInterval(fadeout_maske1_exec, 10);
			fadeIn = setInterval(fadein_maske2_exec, 10);
		} else {
			maske_mc._alpha=0;
			maske_mc2._alpha=100;
			fadeOut = setInterval(fadeout_maske2_exec, 10);
			fadeIn = setInterval(fadein_maske1_exec, 10);
		}
	}
	
	function wait() {
		clearInterval(timer1);
		timer2 = setInterval(wait2, 3000);
//		fadeout_init("2");
//		fadein_init("1");
		fade_init("1");
		if(Ausgabe[x]==undefined) {
			createEmptyMovieClip("maske_mc", 999 + x);
			maske_mc.loadMovie(Ausgabe[0]); 
			x=1;
		} else {
			createEmptyMovieClip("maske_mc", 999 + x);
			maske_mc.loadMovie(Ausgabe[x]); 
			x++;
		}
	}
	function wait2() {
		clearInterval(timer2);
		timer1 = setInterval(wait, 3000);
//		fadeout_init("1");
//		fadein_init("2");
		fade_init("2");
		if(Ausgabe[x]==undefined) {
			createEmptyMovieClip("maske_mc2", 999 + x);
			maske_mc2.loadMovie(Ausgabe[0]); 
			x=1;
		} else {
			createEmptyMovieClip("maske_mc2", 999 + x);
			maske_mc2.loadMovie(Ausgabe[x]); 
			x++;
		}
	}

	wait();
}

 

[Tobias Menzel]

Hi,

bitte poste einmal die .fla mit der dazugehörigen XML-Datei sowie 2 Beispielbildern, damit ich mir ein Bild von der Situation machen kann.

Prinzipiell brauchst Du nicht für jeden Container eine eigene Methode zum Ein- und Ausblenden, sondern kannst beides über eine gemeinsame erledigen (siehe dazu meine Beispiele).

Gruß
.

 

[janbuecker]

Hi,

habe das Problem nun gelöst. Es war ein kleiner Variablenfehler meinerseits

	function fadein_maske1_exec() {
		if(z_in<100) {
			maske_mc._alpha = z_in;
			z_in++;
		} else { clearInterval(fadeIn); }
	}
	function fadein_maske2_exec() {
		if(z_in<100) {
			maske_mc2._alpha = z_in;
			z_in++;
		} else { clearInterval(fadeIn); }
	}

z_in war falsch deklariert

Gruß,
Jan