Solved

How do I activate a movieclip on rollover and rewind it on rollout?

Posted on 2009-03-30
13
2,375 Views
Last Modified: 2012-06-27
I have a movieclip called offer_mc, which I would like to be user activated on rollover and then for it to rewind on rollout, at any point in the timeline.
0
Comment
Question by:LLC0706
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 7
  • 6
13 Comments
 
LVL 5

Expert Comment

by:john_hollings
ID: 24017714
I would use labels to control the movie clip.  For example:  In you movie clip timeline I would have a layer called actions and a layer below called labels.  On frame one of your MC I would have the following ActionScript in a key frame on the actions layer:  
stop();

In the labels layer I would create a blank key frame and label this as start.

In frame two of the labels layer again have a blank key frame and label this over.

Now I'm not sure if you are using ActionScript 2 or 3 and how you have structured your Movie Clip.  However I will continue with the assumption of ActionScript 3.

Create another layer labeled button and create an invisible button.  

Just draw a rectangle with fill but no border.  Select it and press F8 to create a symbol.  Select button from the list and give it a name.  Now double click the symbol you just created and you will see four frames on the timeline.  To create an invisible button click and drag the keyframe to the hit frame.

Return to the timeline of your movie clip and make sure the invisible button is on the button layer extended through to the end of your movie clip timeline.

Give the button an instance name activate_btn for example.  Now move to your main root timeline and if you have an ActionScript layer using the following code to get the activation to work on rollover.

Hope this is of help.

//add an event listener to the activate button to listen out for when someone rolls over it, and action the function activate_btn_ROLLOVER
movieclip_mc.activate_btn.addEventListener(MouseEvent.ROLL_OVER, activate_btn_ROLLOVER);
 
//add an event listener to the activate button to listen out for when someone rolls out, and action the function activate_btn_ROLLOUT
movieclip_mc.activate_btn.addEventListener(MouseEvent.ROLL_OUT, activate_btn_ROLLOUT);
 
//function to action when rollover is detected
function activate_btn_ROLLOVER(e:MouseEvent):void
{
   movieclip.gotoAndPlay("over");
}
 
//function to action when rollout is detected
function activate_btn_ROLLOUT(e:MouseEvent):void
{
   movieclip.gotoAndPlay("start");
}

Open in new window

0
 

Author Comment

by:LLC0706
ID: 24017940
Hi
I forgot to state that I'm using actionScript 2. I've also given my movieclip an instance name of offer_mc.
0
 
LVL 5

Expert Comment

by:john_hollings
ID: 24018000
Ok.  To change this to actionscript 2 you only need to amend the code for the main root timeline.  You don't need the event listeners only the onRollOver and onRollOut functions as shown in the code snippet below.
offer_mc.activate_btn.onRollOver = function()
{
    offer_mc.gotoAndPlay("over");
}
 
offer_mc.activate_btn.onRollOut = function()
{
    offer_mc.gotoAndPlay("start");
}

Open in new window

0
Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:LLC0706
ID: 24023208
This solution works fine, however I would like the movieclip to rewind back through the previous frames on rollout rather than snapping straight back to the first frame as this solution does.

The movieclip is a single layer frame by frame animation, with no tweening. The movie is of a roller garage door, which goes up when the user rolls over it and goes back down again when the user rolls off it, so that if the user then rolls back over it again before it has reached the first frame it will go back up again.

Is this possible?
0
 
LVL 5

Expert Comment

by:john_hollings
ID: 24036897
I believe you could use tweener for this type of reserve playback you are after.

Watch this video if you haven't used Tweener before: http://www.gotoandlearn.com/player.php?id=45
It's AS3 but Tweener in AS2 is practically the same.

You will need to download tweener from here http://code.google.com/p/tweener/downloads/list - Make sure you get the AS2 version and not AS3.  Basically you are going to need the following code within your onRollOut function:

Watch the tutorial to understand tweener and how to use it.

Hope this helps.
offer_mc.activate_btn.onRollOut = function()
{
   Tweener.addTween(offer_mc,{_frame:15, time:1});
}

Open in new window

0
 

Author Comment

by:LLC0706
ID: 24066802
Sorry for the late reply.

I've been trying to get the Tweener to work, but I'm getting the following error message when I test the movie:
------------------------------------------------------------------------------------------------------------------------------
**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: There is no property with the name 'e'.

**Error** C:\Documents and Settings\LLC0706My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: Line 391: There is no property with the name 'e'.
handleError(_tweenList[i], e, "onOverwrite");

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: There is no property with the name 'e'.

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: Line 740: There is no property with the name 'e'.
handleError(tTweening, e, "onUpdate");

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: There is no property with the name 'e'.

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLDcaurina\transitions\Tweener.as: Line 770: There is no property with the name 'e'.
handleError(tTweening, e, "onStart");

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: There is no property with the name 'e'.

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: Line 832: There is no property with the name 'e'.
handleError(tTweening, e, "onUpdate");

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: There is no property with the name 'e'.

**Error** C:\Documents and Settings\LLC0706My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: Line 845: There is no property with the name 'e'.
handleError(tTweening, e, "onComplete");

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: There is no property with the name 'metaError'.

**Error** C:\Documents and Settings\LLC0706\My Documents\My Flash\projectLLD\caurina\transitions\Tweener.as: Line 1068: There is no property with the name 'metaError'.
printError(pTweening.scope.toString() + " raised an error while executing the 'onError' handler. Original error:\n " + pError +  "\nonError error: " + metaError);

Total ActionScript Errors: 12
Reported Errors: 12
-----------------------------------------------------------------------------------------------------------------------------
I'm using Flash MX2004 (not professional)
I've downloaded version: tweener_1_31_74_as_fl7.zip
I've installed the caurina folder locally to the project.
This is the current code:

import caurina.transitions.Tweener;

offer_mc.activate_btn.onRollOver = function()
{
    offer_mc.gotoAndPlay("over");
}
 
offer_mc.activate_btn.onRollOut = function()
{
    Tweener.addTween(offer_mc, {_frame:15, time:1});
}

This is the first time that I have used Tweener; any suggestions?
0
 
LVL 5

Expert Comment

by:john_hollings
ID: 24075243
Firstly, try removing the _ from _frame:

Tweeer.addTween(offer_mc, {frame:1, time:1});

If this does not solve the problem, can you provide your fla file?
0
 

Author Comment

by:LLC0706
ID: 24076390
Hi
I'm not able to provide the .fla file as Expert Exchange does not allow this file format as an attached file.
I've recreated the movie using Flash CS3 Professional, using actionScript 2.0, although it can now be coded using actionScript 3.0 if you prefer.

I've tried removing the_frame from _frame as you suggested; the movie plays but you get this error message:

## [Tweener] Error: The property 'frame' doesn't seem to be a normal object property of [object Object] or a registered special property.

You can view the movie at this address: http://freespace.virgin.net/linda.c

It's almost working correctly, however I would like the door to go down frame by frame on roll out, instead of on the second roll over as it currently does.
0
 
LVL 5

Expert Comment

by:john_hollings
ID: 24085430
EE does not allow fla's but if make a copy of your fla and then rename it with an extension of txt instead of .fla it will upload.  I have done some digging and _frame is the right syntax so without the fla I'm not too sure what to suggest.
0
 

Author Comment

by:LLC0706
ID: 24085747
Hi
I've attached the file for you.
offer-test-01.txt
0
 
LVL 5

Accepted Solution

by:
john_hollings earned 500 total points
ID: 24095302
Hi,

I must admit I couldn't work out why those errors appear however I have provide an alternative solution which after some testing seems to be doing the task you asked for.  The downside is I have had to add quite a bit of code to the MC itself.  This code controls the state and direction of play, which is called by actions in the _root timeline.

Have a look and let me know what you think.
offer-test-02.txt
0
 

Author Comment

by:LLC0706
ID: 24095444
Brilliant! This is exactly how I wanted it to work. Thank you so much for persisting with this.
0
 

Author Closing Comment

by:LLC0706
ID: 31564270
This is exactly how I wanted it to work. Thank you so much for persisting with this.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I come across a lot of question about how to access things in the document class from a movieclip, or accessing something from a movieclip in the document class. It took me a while to figure this out but once I did it makes life so much easier. …
Here are some practices and techniques that can be adopted into your Flash/Flex application development process. Note: Not all "performance tips" provide an immediately-recognizable benefit.   This article does not include timing validation data,…
The goal of the tutorial is to teach the user how to select which audio input to use. Once you have an audio input plugged into the laptop or computer, you will go into the audio input settings and choose which audio input you want to use.
The goal of the tutorial is to teach the user what frame rate is, how to control it and what effect it has on the video.

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question