# MovieClip: Fade Out (Previous) then Fade In (Next)

**URL:** https://forum.kirupa.com/t/movieclip-fade-out-previous-then-fade-in-next/302982
**Category:** flash
**Created:** [January 12, 2010, 12:12am UTC](https://forum.kirupa.com/t/movieclip-fade-out-previous-then-fade-in-next/302982 "2010-01-12T00:12:11Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![Playdo](https://avatars.discourse-cdn.com/v4/letter/p/ec9cab/32.png) [@Playdo](https://forum.kirupa.com/u/Playdo)
#### Post date: [January 12, 2010, 12:12am UTC](https://forum.kirupa.com/t/movieclip-fade-out-previous-then-fade-in-next/302982/1 "2010-01-12T00:12:11Z")

</div>

I need to produce an image gallery which when a thumbnail is pressed it loads a new image, fades out the previous image then fades in the new one.

I have it fading in but I don’t know how to fade the previous image out before.

Here is my code so far:

[COLOR=royalblue]import mx.transitions.Tween;[/COLOR]  
[COLOR=royalblue]import mx.transitions.easing.\*;[/COLOR]  
[COLOR=royalblue]var imageLoader:MovieClipLoader = new MovieClipLoader() ;[/COLOR]  
[COLOR=royalblue]var imageListener:Object = new Object () ;[/COLOR]  
[COLOR=royalblue]imageLoader.addListener(imageListener); [/COLOR]

[COLOR=royalblue]imageListener.onLoadInit = function() {[/COLOR]  
[COLOR=royalblue]var fadeIn:Tween = new Tween(holderMain.holderImage, “\_alpha”, Regular.easeIn, 0, 100, 60, false); [/COLOR]  
[COLOR=royalblue]}[/COLOR]

[COLOR=royalblue]holderMain.holderButton.button1.onRelease = function() {[/COLOR]  
[COLOR=royalblue]imageLoader.loadClip(“one.jpg”,holderMain.holderImage);[/COLOR]  
[COLOR=royalblue]}[/COLOR]

[COLOR=royalblue]holderMain.holderButton.button2.onRelease = function() {[/COLOR]  
[COLOR=royalblue]imageLoader.loadClip(“two.swf”,holderMain.holderImage);[/COLOR]  
[COLOR=royalblue]}[/COLOR]