# How to load external image with transition effect?

**URL:** <https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651>\
**Category:** flash\
**Created:** [May 29, 2008, 2:38pm UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651 "2008-05-29T14:38:34Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![alex298](https://avatars.discourse-cdn.com/v4/letter/a/76d3ee/32.png) [@alex298](https://forum.kirupa.com/u/alex298)\
**Post date:** [May 29, 2008, 2:38pm UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651/1 "2008-05-29T14:38:34Z")

</div>

Hi,

How can I do some transition effect while loading the external image.

The following code is not working. The “picture.png” only waits 3 seconds and appear without any transition effect.

> 

import fl.transitions._;  
import fl.transitions.easing._;

var loader:Loader = new Loader()  
image\_mc.addChild(loader)  
loader.load(new URLRequest(“picture.png”))

// apply wipe transition  
TransitionManager.start(image\_mc, {type:Wipe, direction:Transition.IN, duration:3, easing:None.easeNone, startPoint:1});

Best regards

Alex

---

<div class="post-metadata">

**Author:** ![alex298](https://avatars.discourse-cdn.com/v4/letter/a/76d3ee/32.png) [@alex298](https://forum.kirupa.com/u/alex298)\
**Post date:** [May 30, 2008, 2:09am UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651/2 "2008-05-30T02:09:38Z")

</div>

Hi Ahmed,

Thanks for your help. It works:)

I visited your website. What a wide variety of web design and computer skills you have! And the websites you designed for your clients are really very beautiful.

Thanks and best regards

Alex

---

<div class="post-metadata">

**Author:** ![reblis](https://avatars.discourse-cdn.com/v4/letter/r/b19c9b/32.png) [@reblis](https://forum.kirupa.com/u/reblis)\
**Post date:** [May 30, 2008, 4:19pm UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651/3 "2008-05-30T16:19:18Z")

</div>

I tried to apply Tweener to this but I’m coming up short somewhere?

```auto

import caurina.transitions.*;

var loader:Loader = new Loader()
mcImage.addChild(loader)
loader.load(new URLRequest("picture.jpg"))

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,loadTheImage);

function loadTheImage(){
    Tweener.addTween(mcImage, {alpha:1,time:1, onComplete:timer1, transition:"easeoutExpo"});
}

```

Any ideas?

---

<div class="post-metadata">

**Author:** ![Dimitree](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/dimitree/32/2530_2.png) [@Dimitree](https://forum.kirupa.com/u/Dimitree)\
**Post date:** [May 30, 2008, 4:53pm UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651/4 "2008-05-30T16:53:36Z")

</div>

[quote=reblis;2333667]I tried to apply Tweener to this but I’m coming up short somewhere?

```auto

import caurina.transitions.*;

var loader:Loader = new Loader()
mcImage.addChild(loader)
loader.load(new URLRequest("picture.jpg"))

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,loadTheImage);

function loadTheImage(){
    Tweener.addTween(mcImage, {alpha:1,time:1, onComplete:timer1, transition:"easeoutExpo"});
}

```

Any ideas?[/quote]

I think that the error is here onComplete:function() I mean you have to call a function after onComplete event.  
But I m not an expert… try read the documentation of caurina [http://hosted.zeh.com.br/tweener/docs/en-us/](http://hosted.zeh.com.br/tweener/docs/en-us/) maybe it ll give some answers.

---

<div class="post-metadata">

**Author:** ![reblis](https://avatars.discourse-cdn.com/v4/letter/r/b19c9b/32.png) [@reblis](https://forum.kirupa.com/u/reblis)\
**Post date:** [May 30, 2008, 6:47pm UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651/5 "2008-05-30T18:47:26Z")

</div>

yeah that is a good catch but that wasn’t the problem.

Here is my new code that still doesn’t work. I figure I have to make the mcImage.alpha = 0 before and then fade it p but for some reason it’s not recognizing it.  
I’m also getting this error;  
ArgumentError: Error #1063: Argument count mismatch on imageloader\_fla::MainTimeline/startLoad(). Expected 0, got 1.

```auto

import caurina.transitions.*;

var loader:Loader = new Loader()
mcImage.addChild(loader)
loader.load(new URLRequest("picture.jpg"))

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,startLoad);

function startLoad(){
    Tweener.addTween(mcImage, {alpha:0,time:1, onComplete:loadTheImage, transition:"easeoutExpo"});
}

function loadTheImage(){
    Tweener.addTween(mcImage, {alpha:1,time:5, transition:"easeoutExpo"});
}

```

---

<div class="post-metadata">

**Author:** ![Dimitree](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/dimitree/32/2530_2.png) [@Dimitree](https://forum.kirupa.com/u/Dimitree)\
**Post date:** [May 31, 2008, 9:56am UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651/6 "2008-05-31T09:56:24Z")

</div>

[quote=reblis;2333762]yeah that is a good catch but that wasn’t the problem.

Here is my new code that still doesn’t work. I figure I have to make the mcImage.alpha = 0 before and then fade it p but for some reason it’s not recognizing it.  
I’m also getting this error;  
ArgumentError: Error #1063: Argument count mismatch on imageloader\_fla::MainTimeline/startLoad(). Expected 0, got 1.

```auto

import caurina.transitions.*;

var loader:Loader = new Loader()
mcImage.addChild(loader)
loader.load(new URLRequest("picture.jpg"))

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,startLoad);

function startLoad(){
    Tweener.addTween(mcImage, {alpha:0,time:1, onComplete:loadTheImage, transition:"easeoutExpo"});
}

function loadTheImage(){
    Tweener.addTween(mcImage, {alpha:1,time:5, transition:"easeoutExpo"});
}

```

[/quote]

Ok then maybe… I say maybe… try this  
function startLoad([COLOR=DeepSkyBlue]e:Event[/COLOR]):void { blah blah…  
Place the e:Event into the function…I really don’t know how to call this!

---

<div class="post-metadata">

**Author:** ![Felixz](https://avatars.discourse-cdn.com/v4/letter/f/ecb155/32.png) [@Felixz](https://forum.kirupa.com/u/Felixz)\
**Post date:** [June 3, 2008, 12:28pm UTC](https://forum.kirupa.com/t/how-to-load-external-image-with-transition-effect/261651/7 "2008-06-03T12:28:36Z")

</div>

Event callbacks always needs one paremeter

```auto
function startLoad(event:Event){

```