A Flash Developer Resource Site

Results 1 to 20 of 189

Thread: For everyone with a preloader problem

Threaded View

  1. #1
    Join Date
    Jun 2005

    For everyone with a preloader problem

    Hi. I'm making this thread in response to all of the preloader help posts there are.

    Preloaders can be incredibly simple, to extremely complex, this is why most people have problems with them. Sometimes it's an instance name, and sometimes it's a piece of AS. It can be almost anything.

    Preloaders: How it works

    Preloaders are a way of loading your movie without having your visitors staring at a blank page. Basically, a preloader bounces between two frames, until it is all loaded. It uses dynamic text boxes to display the percent [%] loaded, and a bar animation to show the percent loaded visually, or can display a continuous animation instead.

    Preloaders: The Actionscript

    There is a somewhat standard actionscript used in preloaders, it is:
    on frame one:

    totalBytes = this.getBytesTotal();
    loadedBytes = this.getBytesLoaded();
    remainingBytes = totalBytes - loadedBytes
    percentDone = int((loadedBytes/totalBytes)*100);
    if (_framesloaded == _totalframes) {

    (with an MC instance named "bar" as the loading bar).

    and on frame two:

    Let me break it down:

    totalBytes = this.getBytesTotal();
    loadedBytes = this.getBytesLoaded();
    remainingBytes = totalBytes - loadedBytes
    percentDone = int((loadedBytes/totalBytes)*100);
    Set the variables that will be used later in the script.

    Go to the number of percent done (loaded), such as 50, on "bar"'s timeline, which is exactly 100 frames.

    if (_framesloaded == _totalframes) {
    If all the content in the movie is LOADED, go to and play Frame 3, which consists of the movie's content.

    This is on Frame two, and is how the movie "bounces back and fourth" between frames.

    So basically, the AS is figuaring out how much is loaded, and displaying it, and if everything is loaded, continue.

    Preloaders: The rest of it

    There are other components of a preloader, such as the bar, and dynamic text boxes. These show the percent loaded, both visually and numerically. These aren't required, but are almost always included (at least one of the two). Some people prefer a continuous animation, and a "Loading..." text, but most preloaders consist of both.

    EDIT:Preloaders: Seperate Preloaders

    These are most useful when making a photo gallery or something, so that you can load each picture seperately. I found a great tutorial, have a look:

    Preloaders: Adding the [%] Sign Using AS

    This is something I was searching for when I made a more advanced preloader, and wanted the [%] sign to be dynamically added, and perfect.

    You can replace "percentDone =" (asssuming you are using a preloader script that is somewhat like the tutorial at learningflashmx.com (see tutorials section), and percentDone is the var name of your dynamic text box), With:

    "percent = int((loadedBytes/totalBytes)*100);
    percentDone = percent+"%";"

    Preloaders: How to make them look fluent

    This is a question I had a while ago about how to make my preloader less choppy. I had followed a tutorial, and left my FPS rate at 12, not knowing any better. When I found out that the main cause of this was because my FPS rate was too low, I got very frustrated, since I had already created my site. This is the one thing where you really can't be helped, I'd loved to be proven wrong though.

    Preloaders: Tutorials

    If you would like some step-by-step instruction to creating a preloader, try some of these:

    For creating basic preloaders:




    For creating more advanced preloaders:



    I hope that helps!


    Anybody with more help, tips, etc., feel free to add! If you need help with preloaders, just post it here!
    Last edited by sportzguy933; 02-17-2006 at 09:16 PM.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts

Click Here to Expand Forum to Full Width

HTML5 Development Center