Groups | Blog | Home
all groups > flash actionscript > april 2004 >

flash actionscript : keep playing animation as a button over state


James E. Talmage
4/8/2004 8:30:26 PM
"There is no way of forcing the user to watch the animation, because you
are giving him the option to either see it or take his mouse off of the
button and not see it.there is a way...."

Sure there is. Let the animation movie clip be the button. I'm sure this is
not the most efficient way, but it may be easiest to understand:

Start with the MovieClip which is the animation in the Over state of the
buttton. Let's say it's a square which rotates through a tween 180 degrees
in 10 frames.

Put a new keyframe before the first frame, so that the length of the
animation is one frame longer, and make Frame 1 look just like Frame 2. In
the new Frame 1, put an Action that says: stop();

Put a keyframe in the last frame of the animation. In that keyframe, put an
action that says:
gotoAndPlay(2);

Select frames 2-10 of the animation. Copy them. Paste them at the end of the
animation so that now the timeline of the animation is twice as long.

So now you've got a 21 frame animation, the timeframe of which contains two
identical loops of the animation. It has a stop in frame 1, which looks just
like frame 2. Left to its own devices, of course. it would just stop at
frame 1. But if you somehow tell it to start playing, it plays through until
it reaches the end of the first loop (frame 11) and then jumps to frame 2.
So it leapfrogs the stop in Frame 1 and loops indefinitely from frames 2-11.

Now put an instance of this Movie Clip on the Stage. Select it and attach to
it a script something like this:

onClipEvent(load){
this.gotoAndStop(1);
}
on (rollOver){
this.gotoAndPlay(2);
}
on (rollOut){
this.gotoAndPlay(this._currentFrame+=10);
}

So the Movie Clip (which we're using as an animated button) is stopped when
it loads. On mouseover, it loops indefinitely between frames 2-11. On
mouseout it jumps 10 frames to a frame which looks just like the current
frame. That is, if it's at frame 5 when you mouseout, it jumps to frame 15
and plays to frame 21, after which it loops to frame 1 and stops.

Like I say, this is no doubt kid stuff to more accomplished scripters here,
and I suspect the whole thing could be done more elegantly (with a doWhile
statement?), but anyway, it works and is easy to understand.

JET



yofof
4/8/2004 8:41:16 PM
creativity06
4/8/2004 9:17:44 PM
As soon as you leave that button the animation will stop. If the user wants to
see it then he will keep his mouse over it. Simple as that. There is no way of
forcing the user to watch the animation, because you are giving him the option
to either see it or take his mouse off of the button and not see it.
yofof
4/8/2004 9:25:41 PM
creativity06
4/9/2004 1:23:53 AM
yofof
4/10/2004 4:42:09 PM
[q][i]Originally posted by: [b][b]Newsgroup User[/b][/b][/i]
"There is no way of forcing the user to watch the animation, because you
are giving him the option to either see it or take his mouse off of the
button and not see it.there is a way...."

Sure there is. Let the animation movie clip be the button. I'm sure this is
not the most efficient way, but it may be easiest to understand:

Start with the MovieClip which is the animation in the Over state of the
buttton. Let's say it's a square which rotates through a tween 180 degrees
in 10 frames.

Put a new keyframe before the first frame, so that the length of the
animation is one frame longer, and make Frame 1 look just like Frame 2. In
the new Frame 1, put an Action that says: stop();

Put a keyframe in the last frame of the animation. In that keyframe, put an
action that says:
gotoAndPlay(2);

Select frames 2-10 of the animation. Copy them. Paste them at the end of the
animation so that now the timeline of the animation is twice as long.

So now you've got a 21 frame animation, the timeframe of which contains two
identical loops of the animation. It has a stop in frame 1, which looks just
like frame 2. Left to its own devices, of course. it would just stop at
frame 1. But if you somehow tell it to start playing, it plays through until
it reaches the end of the first loop (frame 11) and then jumps to frame 2.
So it leapfrogs the stop in Frame 1 and loops indefinitely from frames 2-11.

Now put an instance of this Movie Clip on the Stage. Select it and attach to
it a script something like this:

onClipEvent(load){
this.gotoAndStop(1);
}
on (rollOver){
this.gotoAndPlay(2);
}
on (rollOut){
this.gotoAndPlay(this._currentFrame+=10);
}

So the Movie Clip (which we're using as an animated button) is stopped when
it loads. On mouseover, it loops indefinitely between frames 2-11. On
mouseout it jumps 10 frames to a frame which looks just like the current
frame. That is, if it's at frame 5 when you mouseout, it jumps to frame 15
and plays to frame 21, after which it loops to frame 1 and stops.

Like I say, this is no doubt kid stuff to more accomplished scripters here,
and I suspect the whole thing could be done more elegantly (with a doWhile
statement?), but anyway, it works and is easy to understand.

JET[/q]

doesn't work for me

**Error** Scene=Scene 1, layer=wkspc, frame=1:Line 1: Clip events are
permitted only for movie clip instances
onClipEvent(load){

**Error** Scene=Scene 1, layer=wkspc, frame=1:Line 4: Mouse events are
permitted only for button instances
on (rollOver){

**Error** Scene=Scene 1, layer=wkspc, frame=1:Line 7: Mouse events are
permitted only for button instances
on (rollOut){


James E. Talmage
4/11/2004 10:48:24 PM
yofof,

Email me directly and I'll send you the .fla.

What version of Flash are you running?

JET

rlc5611
4/12/2004 3:45:44 AM
Rather than put the animation in the buttons over state, make it a simple movie
clip in the same timeline as the button (or else respect its path). The movie
clip has a blank keyframe as the first frame with a stop(); so that normally
nothing is seen. Say the movie clip is called "myclip". For the button rollover,

on(rollOver) {
myclip.gotoAndPlay(2);
}
Now the clip is independent of what state the button is in and will play to
the end, return to the blank keyframe and stop.
yofof
4/12/2004 1:28:31 PM
[q][i]Originally posted by: [b][b]Newsgroup User[/b][/b][/i]
yofof,

Email me directly and I'll send you the .fla.

What version of Flash are you running?

JET[/q]

i tried to email you but the mail failed
... transport inet_zone_bind_smtp: 550 unknown user
<JETnospam@IllustrationETC.com>

so i put it here:

i run flash mx 2004 pro....i often use an animation in over state button.
looks nice in over state. but when you leave the button area it stops
immediately which i don't like much. i want the movie clip be played until last
frame with stop action at the end or to go back frame to frame to frame 1
(would be even nicer). i'm a greenhorn in flash and action sript.
if you have (or can create ) any fla that contains that 2 actions (with simple
movie clip) please send it to me i would be happy to learn how it works.

thanks a lot


AddThis Social Bookmark Button