Slideshow with alpha-blending

1

I want to make a slideshow as the intro on http://www.alternativ.be/index_be_en.php?sndLvl=2.

For that I’ve made four similar boxes, one with alpha 100% and the other three with apha 50%. They lay on top of each other and on top of the images in my slideshow.

I’ve made this code:

faderOut = function () {
clearInterval(setIntervalFaderOut);
Fader0._x = 0;
Fader1._x = 0;
Fader2._x = 0;
Fader3._x = 0;
tweenOut0 = new Tween(Fader0, “_width”, Strong.easeOut, 450, 0, 0.5, true);
tweenOut0.onMotionFinished = function() {
tweenOut1 = new Tween(Fader1, “_width”, Strong.easeOut, 450, 0, 0.5, true);
tweenOut1.onMotionFinished = function() {
tweenOut2 = new Tween(Fader2, “_width”, Strong.easeOut, 450, 0, 0.5, true);
tweenOut2.onMotionFinished = function() {
tweenOut3 = new Tween(Fader3, “_width”, Strong.easeOut, 450, 0, 0.5, true);
tweenOut3.onMotionFinished = function() {
setIntervalFaderIn = setInterval(faderIn, 5000);
};
};
};
};
};
faderIn = function () {
clearInterval(setIntervalFaderIn);
Fader0._x = 0;
Fader1._x = 0;
Fader2._x = 0;
Fader3._x = 0;
tweenIn3 = new Tween(Fader3, “_width”, Strong.easeOut, 0, 450, 0.5, true);
tweenIn3.onMotionFinished = function() {
tweenIn2 = new Tween(Fader2, “_width”, Strong.easeOut, 0, 450, 0.5, true);
tweenIn2.onMotionFinished = function() {
tweenIn1 = new Tween(Fader1, “_width”, Strong.easeOut, 0, 450, 0.5, true);
tweenIn1.onMotionFinished = function() {
tweenIn0 = new Tween(Fader0, “_width”, Strong.easeOut, 0, 450, 0.5, true);
tweenIn0.onMotionFinished = function() {
setIntervalFaderOut = setInterval(faderOut, 500);
};
};
};
};
};
faderOut();

I’m thinking on switching between the images in tweenIn0.onMotionFinished = function() { … }

My questions is now:

  • Can you optimze this code (a lot)?
  • Is it possible to, instead of starting the tweens after each other, then to start one and when that is almost halfway done then start the other etc…