Article

Home » Design and Layout » Flash Tutorials » Flash Script - Flash MX Dragable Rubber Band Effect

About the Author

SitePoint

View all articles by SitePoint...

Flash Script - Flash MX Dragable Rubber Band Effect

By SitePoint

April 28th, 2003

Reader Rating: 8.5

1. Start by creating a movie that has the dimensions: width=400 and height=50.

2. Create a mouse pointer.

3. Now, convert the mouse pointer to a movieclip, name it "pointer", then give it an instance name of "pointer".

4. Using the text tool, type "RUBBER" -- it should appear as shown in the movie above.

5. Select the text and convert it to a movieclip. Name it "rubber", and give it an instance name of "rubber".

Now, double click the text movieclip to go into its timeline.

6. Create a new layer, and name it "Button".

8. In the button layer, create an invisible button.

9. Apply these actions to the button:

on (rollOver) {
 Mouse.hide();
 _root.pointer._visible = true;
}
on (rollOut) {
 Mouse.show();
 _root.pointer._visible = false;
}
on (press) {
 Mouse.hide();
 _root.pointer._visible = true;
 _root.flag = true;
 _root.elas = false;
}
on (release, releaseOutside) {
 Mouse.show();
 _root.pointer._visible = false;
 _root.flag = false;
 _root.elas = true;
}

10. Go back to the main timeline (i.e. scene1) and in the default keyframe, insert the action:

//make the pointer invisible
pointer._visible = false;
flag = false;
elas = false;
//start width is width of movieclip
startwidth = 100;
//mvwidth is width of movie
mvwidth = 400;
function setwidth()
{
 if(flag) {
   width = mvwidth - _xmouse
   width = width + 100
   rubber._width = width
   iws = rubber._width
 }
 if(elas){
   elastic += (startwidth - rubber._width);
   elastic *= .4
   rubber._width += elastic;
 }
}
//this acts as a timer it calls the setwidth function  
every 50 milli seconds
setInterval(setwidth,50)

Finished! Now, test the movie!

If you liked this article, share the love:
Print-Friendly Version Suggest an Article

Sponsored Links

Rate This Article

  • 1
    Poor
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
    Great

Comment on This Article

Have something to say?

Post A Comment

You need to be a member of the SitePoint Forums to comment on this post. Sign Up

Already a member? Post using your SitePoint Forums account: