Flash Script – Flash MX Dragable Rubber Band Effect

Share this article


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!

Georgina LaidlawGeorgina Laidlaw
View Author

Georgina has more than fifteen years' experience writing and editing for web, print and voice. With a background in marketing and a passion for words, the time Georgina spent with companies like Sausage Software and sitepoint.com cemented her lasting interest in the media, persuasion, and communications culture.

Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week
Loading form