How to use onClipEvent(mouseUp) and onClipEvent(mouseDown)

Harnessing clip events to capture and distinguish between mouse clicks is a clever way of making dynamic buttons. Just like you embed on release or press code etc. on orthodox buttons, you can use the clip event handlers for mouse interactions (in unison with collision detection) to create dynamic buttons and interactivity using movie clip symbols. In this tutorial I will show you how clip events for mouseUp and mouseDown can be used to start and stop a timer and launch an action as a result of the length of time the timer runs for. To demonstrate this, I will use our trusty little friend the penguin once again.

There are two clipEvents that you can use in association with clicking your mouse, mouseDown, and mouseUp. These are fairly self explanatory, and work in much the same way as KeyUp and KeyDown.

If you use the mouseUp and mouseDown events as they are, there is now way of telling what you clicked on, all the instances with this clipEvent instruction will respond to any mouse click. To simulate a button, you need to perform a collision detection to see if your movie clip and the users mouse are at the same global position.

In this demonstration I will show how a timer can be started with the mouseDown event and stopped with the mouseUp event.

The idea behind my demonstration is that the longer you hold your mouse down, the higher our little friend the penguin is going to jump (he is a world champion vertical jumping penguin). As we all know, penguins are very obedient, and often can be found doing vertical jumps on request.

When we press the mouse down, a clipevent checks to see if we have clicked on the penguin or not (using the hittest method), and if we have, it starts the timer. The clip event we will use is the MouseDown event which tracks all clicks down of the mouse.