Fading preloader - SWiSHMax Tutorials

Home | Help Forums | Web Design Tutorials | Free Swishmax Downloads | All Downloads



Company
Home
Nework Details
Tutorials
SWiSH 2
SWiSHMax
Flash MX
PHP & MySQL
HTML / JScript
Adobe Photoshop
Corel Draw
Gimp
Miscellaneous
Downloads
Templates
Plugins
Fonts
Wallpapers
Free Images
Scripts and Codes
Products
E-Books
SWiSH BB
SWiSH Templates

SWiSH-DB Newsletter

Subscribe to our newsletter : GO

Partners / Affiliates

Swish Templates

SWiSH Climax

GimpTalk

Idea Designs

Sposatoettore

Try Acai Berry Diet

Download Free Ringtones

Swishzone

Manage your site with Flax Article Content Management System

Hello,

Nothing really inovative in this little tut. Only another way to use "getPercentLoaded()"

Imagine you have to load a big external image. "virgood.jpg" (200 kb).

1. Well, made a low quality copy of this image and name it "virpoor.jpg"
2. insert this image in your movie--> convert to sprite. Name this sprite "lowres"
3. duplicate this sprite and name it "highres". Place "highres" under "lowres"
(you can delete the picture "virpoor.jpg" in sprite "highres"
4. group both in a new sprite and name it "foto"
Important : the 2 sprites "lowres" and "highres" must have the same position. In my example _y=0 _x=0
5. Place this code in main timeline :

QUOTE

onLoad () {
foto.lowres._alpha=0;
foto.highres.loadMovie("http://www.dibuweb.com/swishtest/preloader/virgood.jpg");
//loading good picture in "foto.highres"
chargeur.gotoAndPlay("preloader");
//play the preloader
}

6. create a sprite with the preloader code . I named it "chargeur" there's the code of this sprite

QUOTE

onFrame (1,afterPlacedObjectEvents) {
setLabel("start");
}
onFrame (5,afterPlacedObjectEvents) {
stop();
}
onFrame (10,afterPlacedObjectEvents) {
setLabel("preloader");
}
onFrame (11,afterPlacedObjectEvents) {
fading = _root.foto.highres.getPercentLoaded();
_root.foto.lowres._alpha=fading;
// sets the alpha of the 'low res' pict to fading
_root.foto.lowres.fade= "Fading in ... (" add fading add ")";

if (fading >= 100 && _root.foto.highres.getBytesLoaded() >= 100) {
// When loading of 'high res' picture is done begins the fade out of 'low res' picture
_root.expli="2. Now the 'low quality' pict is fading out and made appears the 'high res' pict.";
_root.foto.lowres.fade= "Fading out ... ";
_root.foto.lowres.gotoandplay(20);
gotoAndPlay("start");
}
}
onFrame (12,afterPlacedObjectEvents) {
// ## Boucle du preload ##
prevFrameAndPlay();
}
onFrame (20,afterPlacedObjectEvents) {
stop();
}

So what it does ?
While the good external pict is loading, the bad image is fading in according of the amount of "getPercentLoaded()" .
When load is complete bad pict is fade out and disappears.
And the good pict (under the bad one) appears.

Hope it helps.
View HERE

download example
http://www.swish-db.com/forum/index.php?sh...showtopic=12678