• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

MouseOver movieclip going back and forth on timeline

Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Hi, I have a 80 pictures showing an object in 360°. I want to be able to go back and forth on the timeline by moving the mouse to the left or to the right. How can I do that?

Views

413

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Explorer , Jul 20, 2017 Jul 20, 2017

Hi This is what I was looking for. And it works!

myBla360.stop();

myBla360.addEventListener(MouseEvent.MOUSE_OVER,mover);

myBla360.addEventListener(MouseEvent.MOUSE_OUT,mout);

function mover(e:MouseEvent):void {

    stopPlayReverse();

    myBla360.play();

}

function mout(e:MouseEvent):void {

    this.addEventListener(Event.ENTER_FRAME, playReverse, false, 0, true);

}

function playReverse(e:Event):void {

    if (myBla360.currentFrame == 1) {

        stopPlayReverse();

    } else {

        myBla360.prevFrame();

 

...

Votes

Translate

Translate
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

First you tell us whether you're working in an AS3 or Canvas document.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

I am working in AS3

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Then you just add an event listener to the stage for mouse movement, get the mouse X coordinate in the event handler, then use the Power of Math to turn that coordinate into a frame number. Something like this:

stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);

function mouseMoveHandler(evt:MouseEvent):void {

    var percent:Number = evt.stageX / stage.stageWidth;

    percent = Math.max(0, Math.min(1, percent)); // clamp to 0 - 1 range

    myBla360.gotoAndStop(percent * 80);

}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Hi I do´nt want to move in 360°, it is all pictures taken one by one, 80 off them.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Okay...?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

The myBla360 is a movieclip that has 80 frames in it. You would have imported your 80 images into that movieclip. One thing that could be changed is the 80:

myBla360.gotoAndStop(percent * myBla360.totalFrames);

then you could have any number of images.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Hi this is not working. I am not english speaking, but I thought I made my self understandable, but I clearly did not.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

We understand you just fine. You're not understanding us.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Ok, I will try again.

I want to play the movieclip myBla360 to the next frame or the previous frame depending on where the mouse is on the movieclip. If I move the mouse to the right the movieclip plays forward, if I move the mouse to the left it plays backwards.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

You wouldn't want it to play, it just needs to go to the frame frame. The gotoAndStop() line will do that for you.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

How can you program each frame to stop at next frame or previous frame?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Ummm.... nextFrame() and prevFrame().

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Am I so misunderstood? I am talking about moving the mouse!!!!!!

I would have thought it had something to do with the xmouse and ymouse.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

The word "mouse" was not in your previous post.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

"Hi, I have a 80 pictures showing an object in 360°. I want to be able to go back and forth on the timeline by moving the mouse to the left or to the right. How can I do that?"

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

If you look at these two lines:

stage.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);

function mouseMoveHandler(evt:MouseEvent):void {

the first line adds a listener to call the function every time the mouse is moved. Then in the function the variable 'evt' gets all the information about the event. One of the properties it gets is stageX, which is the x position of the cursor's position on the stage. This line:

var percent:Number = evt.stageX / stage.stageWidth;

uses that value to calculate how far across the stage you are at the time.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

Thank you! Can you show me an example how to put the values in? The stage is 1200x600 and the movieclip is 550x400 aligned to the left side in the middle.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2017 Jul 18, 2017

Copy link to clipboard

Copied

ClayUUID's code in message 3 gets the stage width, so you wouldn't need to put in values. If you wanted to go through all of the images in the time it takes to mouse across the movieclip itself, you could add the mouse move listener to the movieclip, and then there is a local x value you can use. The code would be:

myBla360.addEventListener(MouseEvent.MOUSE_MOVE, mouseMoveHandler);

function mouseMoveHandler(evt:MouseEvent):void {

    var percent:Number = evt.localX / myBla360.width;

    percent = Math.max(0, Math.min(1, percent)); // clamp to 0 - 1 range

    myBla360.gotoAndStop(percent * myBla360.totalFrames);

}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 19, 2017 Jul 19, 2017

Copy link to clipboard

Copied

Hi I still do not understand where I put the value

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 20, 2017 Jul 20, 2017

Copy link to clipboard

Copied

Hi This is what I was looking for. And it works!

myBla360.stop();

myBla360.addEventListener(MouseEvent.MOUSE_OVER,mover);

myBla360.addEventListener(MouseEvent.MOUSE_OUT,mout);

function mover(e:MouseEvent):void {

    stopPlayReverse();

    myBla360.play();

}

function mout(e:MouseEvent):void {

    this.addEventListener(Event.ENTER_FRAME, playReverse, false, 0, true);

}

function playReverse(e:Event):void {

    if (myBla360.currentFrame == 1) {

        stopPlayReverse();

    } else {

        myBla360.prevFrame();

    }

}

function stopPlayReverse():void {

    if (this.hasEventListener(Event.ENTER_FRAME)) {

        this.removeEventListener(Event.ENTER_FRAME, playReverse);

    }

}

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 20, 2017 Jul 20, 2017

Copy link to clipboard

Copied

So what you actually wanted was to play a movieclip forward and reverse in response to the mouse moving over one of two different movie clips. Which is not at all what you said in the first place.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 21, 2017 Jul 21, 2017

Copy link to clipboard

Copied

Well, this was the original question, and I thought you understood it.

"Hi, I have a 80 pictures showing an object in 360°. I want to be able to go back and forth on the timeline by moving the mouse to the left or to the right. How can I do that?"

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Jul 21, 2017 Jul 21, 2017

Copy link to clipboard

Copied

LATEST

There is only one movieclip

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines