Convert any photo into a modern button with url

Date: 18.2.2009, 11:4    Total views: 34032

This, step by step flash lesson, will show you how to convert any photo into a modern button with url using a little action script code. You can use this modern button for any web site! Let's start!










Example:




Step 1

First, find any photo which you like to convert into a modern button. You can also if you like save my photo below to make this lessonto more quickly!





Step 2


Create a new flash document. Press Ctrl+J key on the keyboard (Document Properties) and set the dimensions of your document as whatever you like. Select any color as background color. Set your Flash movie's frame rate to 30 and click ok.



Step 3

Choose now File > Import > Import to Stage (Ctrl+R) and import any photo into a flash stage.

Step 4

While the photo is still selected, press F8 key (Convert to Symbol) to convert it into a Movie Clip Symbol.



Step 5

Double-click on the movie clip on stage with the Selection tool(V).You should now be inside the Movie Clip.



Step 6

While the photo is still selected, press again F8 key (Convert to Symbol) to convert it again into a Movie Clip Symbol!



Step 7

Click now on frame 15 and press F6 key.

Step 8

Go back now on frame 1, take the Selection Tool (V) and click once on the photo to select it. After that, go again to the Properties Panel (Ctrl+F3) below the stage! Then, select Filters tab from the left side. Click after that on the plus icon and select the Blur filter. Make the adjustments as follows:



Step 9

Right-click anywhere on the gray area between the two keyframes on the timeline and choose Create Motion Tween from the menu that appear.



Step 10

Create now a new layer above the layer 1 and name it action.

Step 11

Click now on the first frame of layer action and go to the Action Script Panel (F9). Then, enter this code inside tha actions panel:

stop ();

this.onEnterFrame = function(){
if(rewind == true){
prevFrame();
}
}

this.onRollOver = function(){
rewind = false;
play();
}

this.onRollOut = function(){
rewind = true;
}

this.onRelease = function(){
getURL("http://www.flashfridge.com");
}

Step 12

Click now on frame 15 of layer action and press F6 key. After that, go again to the Action Script Panel (F9) and enter this code inside the actions panel:

stop();

Now, we're done!

Test your Movie and enjoy!

Download source file (.fla)

  Digg it! Add this tutorial to del.icio.us! Furl it! Add this tutorial to reddit! Spurl it! Add this tutorial to technorati!
Share
ShareSidebar