Flash Script – Ball and Line Effect

Tweet


type = 'application/x-shockwave-flash'
data = 'http://sitepointstatic.com/flash/ballline.swf'
width = '400'
height = '400'
bgcolor = 'black'
>

Download the sample files here.

1. Create two circular objects, and make one larger than the other.

2. Convert both these objects into movieclips.

3. Give the larger circular object an instance name of "parent".

4. Give the smaller one the instance name "child1".

5. Create a diagonal line as shown below.

1081_tool1

6. Convert it to a movie clip and give it an instance name of "line".

7. Right click "child1", go to actions, and insert the action:

onClipEvent (load)  
{  
spring = false;  
startX = _x;  
startY = _y;  
spX = 0;  
spY = 0;  
_root.line._visible = 1;  
parentx = _root.parent._x;  
parenty = _root.parent._y;  
_root.line._x = parentx;  
_root.line._y = parenty;  
_root.line._xscale = _root.child1._x-parentx;  
_root.line._yscale = _root.child1._y-parenty;  
}  
onClipEvent (mouseDown)  
{  
startDrag ("", true);  
spring = true;  
}  
onClipEvent (mouseUp)  
{  
stopDrag ();  
spring = false;  
}  
onClipEvent (enterFrame)  
{  
parentx = _root.parent._x;  
parenty = _root.parent._y;  
_root.line._x = parentx;  
_root.line._y = parenty;  

//////  
_root.line._xscale = _root.child1._x-parentx;  
_root.line._yscale = _root.child1._y-parenty;  

//!spring = if false  
if (!spring)  
{  

//code to create the movements  
spX += (startX-_x);  
spY += (startY-_y);  
spX *= .09;  
spY *= .09;  
_x += spX;  
_y += spY;  
}  
}

8. That's it! Press ctrl+enter to test the movie.

Free JavaScript: Novice to Ninja Sample

Get a free 32-page chapter of JavaScript: Novice to Ninja and receive updates on exclusive offers from SitePoint.

No Reader comments