Website Designers and Webmasters

Dedicated to all the tasks Webmasters, Website Developers and Website Designers find themselves facing.

By: Ashton Sanders

ActionScript – Loading Screen – Part 3

May 8 2007

The third part of this ActionScript Loading Bar Tutorial will be putting together everything we have learned so far in this tutorial and making it work.

At the end of the ActionScript – Loading Screen – Part 2, we had put together a simple piece of code that will shrink the size of our loading bar to the same percentage that our movie has been loaded so far. (ie. If the movie is 45% loaded, the loading bar will be 45% wide.)

Now if you plug that into a movie, it will check our piece of code once, but not again, here is what you would do to have it check the code every frame.

On the first frame, of our movie, we put this code:

percent = (_root.getBytesLoaded()/_root.getBytesTotal())*100;
_root.loader._xscale = percent;

On the second frame of our movie we put this code:

if(percent < 100){
gotoAndPlay(1); //go to frame one again
}else {

To summarize that if statement: If the movie isn’t done loading, go back to frame one and start over. This will run the code we placed on frame one, and update the width of our loading bar. Otherwise (else), the movie has completed loading, and it is time to play! (Yes, the play(); is redundant, because that’s what the movie would do automatically.

Then all you have to do is set up your movie to play in the next scene, and WALA! you have one beautiful Loading Bar!

-Let me know if this helped you,
-Ashton Sanders

By: Ashton Sanders

ActionScript – Loading Screen – Part 2

May 7 2007

The second part of this ActionScript Loading Bar Tutorial will be discussing that ratio between the bytes loaded so far and the total size of the movie in bytes.

*Click Here for Part 1 of the ActionScript Loading Screen*

ActionScript Theory

The theory behind this is very simple: If you take the amount of bytes that has already been loaded in your move, and divide it by the total size of your movie, you will end up with the percent of your move that is loaded.

ActionScript Code

We will be using two ActionScript Commands:

//How many Bytes have been loaded so far.

//And the total bytes in the movie

Using the formula above, we come out with


This will give us a decimal like .4, which means 40%. so we are going to multiply it by 100 to get the correct number:


Great, now lets apply this to what we discussed in Action Script – Loading Bar – Part 1. We are going to assign this percentage to the _xscale (or width) of the loading bar (_root.loader).

_root.loader._xscale =

Great! Now we have the function for setting the width of the load bar. When the movie first starts loading, and there is only 1 byte loaded out of 4,000 bytes, the loading bar will be almost completely invisible, then as the number of bytes increases, the width of the bar will increase until 4,000 out of 4,000 bytes have been loaded and the loading bar is back to its normal width.

Last Step

We only have one step left to finish our loading bar, which you can view in Part 3 of this ActionScript Loading bar Tutorial.

Click to view all of the ActionScript Loading bar Tutorials on one page.

-Continue to ActionScript Tutorial Part 3
-Ashton Sanders

By: Ashton Sanders

ActionScript – Loading Screen – Part 1

May 5 2007

Here is a Loading Bar I developed using the ratio of Loaded bytes to total bytes.

ActionScript _xscale

This script uses three main elements. The first one we will discuss is: “_xscale”

//This is used to specify the
//width of an symbol (ie. movieClip)
_root.movieClip._xscale = *number between 0 and 100*

To go into more detail into that last element, if your movie clip is named “loaderbar” and you made it to be at its full length (about 200 pixels lets say), you could type:

_root.loaderbar._xscale = 50;
//That would squeeze it to
//100 pixels (50%)

This is what we will be using to slowly move the bar across the screen as the file is loaded.

Here is a Flash Loading Bar to demonstrate the _xscale Property.

This is continued in ActionScript Loading Screen Part 2
-Ashton Sanders

By: Ashton Sanders

ActionScript – this

Apr 15 2007

Filed under: Flash ActionScript

This ActionScript/Flash Tutorial is like all of my tutorials, quick and to the point. I hope I don’t type too fast for you. 😉

Using “this” in Flash/ActionScript

The “this” command/function is an extremely useful one. It makes it easy to use relative paths (as opposed to absolute).

Here is what the Adobe Dictionary says about “this”:

Keyword; references an object or movie clip instance. When a script executes, this references the movie clip instance that contains the script. When a method is called, this contains a reference to the object that contains the called method.

Inside an on event handler action attached to a button, this refers to the Timeline that contains the button. Inside an onClipEvent event handler action attached to a movie clip, this refers to the Timeline of the movie clip itself.

To put that into English:

If you have a movie clip, and your “on (press)” statement is:

//On Press, the button will disappear.
on (press){
this._visible = 0

This will work no matter how many levels deep into the movie you move this movie clip. “This” calls the path to that movie clip. So if your movie clip is named “mcbutton”, and it’s placed on the root of your movie:

on (press){
// Returns: “_level0.mcbutton”

That is a very useful piece of ActionScript to know, as you will end up using that in every movie you make. basically the same thing as _root. A more extensive definition will come soon.

Another Note about “this”

If the above example was done with a button instead of a movie clip, the trace(); would return “_level0”

-“Flash is by far my favorite computer program.”
-Ashton Sanders

By: Ashton Sanders

ActionScript Basics – Variables

Apr 13 2007

Filed under: Flash ActionScript

This post is about variables in AcrionScript (the programming language for Macromedia/Adobe Flash).

ActionScript Basics

Some very quick basics

// <- These two slashes are a comment.
// Everything after a comment on that line
// will not be processed by Flash


Varbiable Basics

What is a variable? A variable is group of numbers and letters or one letter that will store an amount, a string or a true/false statement. A variable cannot start with a number.

// This Creates the variable “x” and
// gives it the numeric value of 4
x = 4;

// trace() will display whatever you put
// between the “(” and “)”.

// That will display: 4

In this example, the numeric value of “4” was stored in the variable “x”. Here is another example:

number = “4”;

// 4

These last two examples were very similar, but notice that the variable (number) was given the value of “4” (with quotes around it). The quotes changed the value of the variable from a numeric value to a string. A string is just a group of number, letters, symbols, etc. defined with quotes.

statement = “Here’s a statement for you”;

// Here’s a statement for you

As I mentioned above, you can give a variable a numeric, string or true/false value. This third value type is called a Boolean value. A boolean value is either yes/no, true/false, 1/0, on/off, etc. In Action Script, you can assign them with either true/false or 1/0.

go = true;

// true

That is a quick summary of how to declare variables the shorthand way in ActionScript. My next posts will be along these same lines, so if you are hungry for more, check out my other ActionScript Posts them out.

If you have any questions, or if I was unclear at any part, feel free to leave a comment, and I’ll get it fixed up for you.

-Until Then,
-Ashton Sanders

Older Posts »

Where Am I?

You have found the semi-coherent ramblings of Ashton Sanders: a website designer, developer and webmaster. This is primarily Ashton's place to save notes about techniques and things that he learns in his never-ending conquest of the internet. Hopefully it's coherent enough to be useful to you too.


Enter your email to get automatic emails whenever Ashton posts on the blog.


Tags and Categories


Blog Roll