Movie Clip Timeline Controll With Mouse Position

[MrMizou15]

Hi everybody!,

I am new to this forum, and would love to be of help to any of you. I am having a problem myself though. It seems to be basic, but I can't find it anywhere, and i have tried so many times i am not sure what to do.

Here's the problem.

I have a Movie Clip called Menu1, it has it's own timeline inside, a rotating menu. I want the menu to move according to the mouse position. When you move the mouse to the left it will start off slow (if you are close to the center of the page) and speed up when you get to the edge. When going left i want the timeline to play forward (from the point i is currently at), when going to the right it will start off slow (if you are close to the center of the page), and speed up when you get to the edge, but i want it to play the timeline backwards (from the point it is currently at).

In other words how do i use the mouse to controll the timeline in the movie clip called menu1? I can figure out the slow/fast part( if need be), I am really stumped can anyone help?

[SwirlyKing]

As far as I know, you can't play a timeline in reverse. The closest I've ever come to that is looping a prevFrame() function. Is it really a timeline you need to manipulate? or is it positioning? Positioning is relatively easy to do.

[MrMizou15]

I actually have the timeline working in reverse, i used an external swf to moniter the loop. Here is the code, i just need now the mouse to control the actions, not the buttons.also i would like the timeline to speed up and slow down depending on how close to the center the mouse is. such as when you go the right edge the menu is moving fast, when you get to the center it is almost stoped, at dead center it is stoped, then to the left it rotates other way real slow near center, then go towards edge of left spining faster. ? make sense? . Thanks i appreciate any help!

[jbum]

Let's say you could control the playback speed with a single number. When that number is 0, it is stopped. When the number is 1,2,3... it is going forward at increasing speeds, and when the the number is -1,-2,-3... it is going backward at increasing speeds.

Let's say the maximum speed you want in either direction is 10 (or -10).

kMaxSpeed = 10;

The range of speeds travelled (from -10 to 10) is 20, or kMaxSpeed*2.

kSpeedRange = kMaxSpeed * 2;

The mouse travels from 0 to Stage.width.

If we divide the mouse position by Stage.width, we'll get a number that goes from 0 to 1.

ratio = _root._xmouse / Stage.width

We can multiply that ratio by the kSpeedRange to get a number that goes from 0 - 20. Then we offset it by -kMaxSpeed to get a number that goes from -10 to 10.

So this is the basic transform you need to convert mouse position to speed:

pbSpeed = (_root._xmouse / Stage.width) * kSpeedRange - kMaxSpeed;

I usually move the multiplication forward, so I can remove the parentheses:

pbSpeed = _root._xmouse * kSpeedRange Stage.width - kMaxSpeed;

...the result is the same.

You can do this from an onEnterFrame handler or onMouseMove handler.

code:

---

mc.onEnterFrame = function()

{

  kMaxSpeed = 10;

  kSpeedRange = kMaxSpeed * 2;

  pbSpeed = _root._xmouse * kSpeedRange / kStageWidth - kMaxSpeed;

  this.gotoAndStop(this._currentFrame + pbSpeed);

}

---

Or, to reduce the number of temporary variables:

code:

---

mc.onEnterFrame = function()

{

  this.gotoAndStop(this._currentFrame + _root._xmouse * 20/ kStageWidth - 10);

}

---

The equation I've given you gives you a linear speed change. You may decide that you want the movie to move relatively slowly when the mouse is near the center, but then speed up a lot more when it is near the edge. In this case, you can use Math.pow() to increase the magnitude of pbSpeed exponentially as the mouse nears the edge.

Hope this helps.

[MrMizou15]

I havent had a chance to try it yet, but i have saved it to my computer, tommorow morning i will start working on it! I will post the results, it will probably be a couple of days before i post, thanks again!

[Tedley]

Hi All - I'm trying to do the something similar to what MrMazou15 described. I'm still getting my brain wrapped around action script, so I'f I've glommed this off the get-go please be gentle.

I managed to implement the reverse direction code - but I suspect I will need to break this apart and tween it.

What I'm after is for the ring rotation to reverse directions according to the position of the mouse as described above. The intent is to come up with a "3d" version of the barneys menu.

Is there a way to do this entirely with actionscript - similar to Jbums brilliant (ala tomb raider) circular menu?

Any help / suggestions is appreciated. I've attached the mx source file. Feel free to hack away.

- Tedley
ted@tedbell.com

[RudeBoyAl]

Hello! I'm having difficulty finding out how to control the timeline speed of a movie clip which i have created and placed on stage. I have attached the FLA file with this post but I will, however make efforts to describe it and what I would like to do with it...

On the stage of the FLA file there is an instance of a movie clip with three mask like faces, which I have named "logo", and an instance of a movie clip with a button in it, which I have named "entrez".

There are three layers in the timeline, which lasts 30 frames in this movie...

1. actions
2. logo
3. button

In frame one of the actions layer I have placed the following actionscript:

stop();

In frame 30 of the actions layer I have placed the following actionscript:

_root.logo.gotoAndPlay("stopanim");

By looking at this actionscript you must have guessed that it controls the timeline in the movie clip instance named "logo".

I have attributed the following actionscript to the "entrez" movie clip button:

on (release) {
gotoAndPlay(2);
_root.logo.gotoAndPlay("startanim");
}

This is so that the main timeline goes to frame 2 and plays and that the movie clip "logo"'s timeline goes to the frame labelled "startanim", which also happens to be frame 2.

Note that in frame 2 of the main timeline I have placed the following actionscript in order to make sure the movie plays from that frame onwards:

play();

OK... Now to describe the movie clip instance, "logo":

There are 5 layers in the movie clip's timeline.

1. labels
2. actions
3. face 1 (the rotary animation for face1)
4. face 2 (the rotary animation for face2)
5. face 3 (the rotary animation for face3)

Frame 1 in the "labels" layer has been labelled "stopanim" and frame 2 has been labelled "startanim"

Frame 1 in the actions layer has the following actionscript:

stop();

Frame 2 in the actions layer has the following actionscript:

play();

and frame 29 in the actions layer has the following actionscript:

gotoAndPlay("startanim");

As you may have guessed, after having read all this... When you see is the inanimate logo and the button. When you press the button on the main stage it tells the main timeline to go to frame 2 and play and at the same time it tells the movie clip, "logo", to play frame 2 ("startanim"), and therefore start the animation of the logo. When it reaches the last frame of the logo timeline it is told to go back to frame 2 ("startanim") again, hence a loop, which allows the logo to rotate infinitely.
When the main timeline reaches frame 30, the actionscript tells the "logo" movie clip to go back to frame 1, labelled "stopanim", which as you may have guessed stops the animation loop.

This is all good because the result is that I get a full loop cycle within the 30 frames and then it stops.

What I would like to do is that, when I press the button, the logo animation begins slow but accelerates gradually to a fast spin, where the logo spines a couple of times and then slows down again before the main timeline gets to frame 30.

Is it possible to do this? and if so... How?!?

Thanx in advance and I much appreciate the time of he who finds me a solution. I will continue searching...

Thank you again.

Have a nice day!

Oh and please excuse the long and tedious description lol