A Flash Developer Resource Site

Page 1 of 2 12 LastLast
Results 1 to 20 of 33

Thread: Rollover within Rollover?

  1. #1
    Senior Member
    Join Date
    Jan 2003
    Location
    Nebraska
    Posts
    448

    Rollover within Rollover?

    Ok, here's the deal. I have a large picture that I want to fade to black and white when someone rolls the mouse over. So in the picture movie clip I have something like:

    on (rollOver) {
    gotoAndPlay ('bw');
    }
    on (rollOut) {
    gotoAndPlay ('color');
    }

    Then inside the big picture I have hotspots that will highlight when the mouse rolls over them. So for the hotspot movie clips I put something like:

    on (rollOver) {
    gotoAndPlay ('highlight');
    }
    on (rollOut) {
    gotoAndPlay ('normal');
    }

    The hotspot movie clips are above the main picture in the timeline. The problem I get is when you mouseover a hotspot to highlight it, the main image registers this as you rollout of it and changes back to color. Does anyone know of a way to keep the main image black and white when you are rolling over the hotspots but still turn it back to color when you roll off the entire thing? Oh, and I can't use actual mouse x,y to do this because the image and hotspots will need to be changed and updated regularly.
    ecards - My full flash site.

  2. #2
    Senior Member jbum's Avatar
    Join Date
    Feb 2004
    Location
    Los Angeles
    Posts
    2,920
    Are the hotspots attached to the picture, or are they attached to root and sitting on top of the picture? In other words do you have these objects:

    (nested)
    _root.bigpicture
    _root.bigpicture.hotspot1
    _root.bigpicture.hotspot2

    or these objects:

    (non-nested)
    _root.bigpicture
    _root.hotspot1
    _root.hotspot2


    ?

    - Jim

  3. #3
    Senior Member
    Join Date
    Jan 2003
    Location
    Nebraska
    Posts
    448
    Currently they are like the second option you listed, although I have tried both ways with no luck.
    ecards - My full flash site.

  4. #4
    Senior Member jbum's Avatar
    Join Date
    Feb 2004
    Location
    Los Angeles
    Posts
    2,920
    Unfortunatly, Flash will only allow one object to be roll-overed at a time.

    Also, if you nest the hotspots inside the picture, then the hotspots won't receive rollover events at all, because the outer clip eats the event.

    In short, Flash does not support nested rollovers which is what you want here.

    However, I found a somewhat kludgy work-around, and I'm enclosing a FLA file that demonstrates it.

    You nest the movieclips, and then use an onEnterFrame handler to generate a fake rollover event for the inner (nested) clips by using hitTest.

    Here's the script. It assumes the outer clip is named mcclip and the inner clip is named mc (or mcclip.mc).

    code:


    mcclip.onRollOver = function()
    {
    trace("outer rollover: " + this);
    }

    mcclip.onRollOut = function()
    {
    trace("outer rollout: " + this);
    }

    mcclip.mc.onEnterFrame = function()
    {
    if (this.hitTest(_root._xmouse, _root._ymouse, true))
    {
    if (!this.isRollOver)
    {
    this.isRollOver = true;
    trace("inner rollover: " + this);
    }
    }
    else {
    if (this.isRollOver)
    {
    this.isRollOver = false;
    trace("inner rollout: " + this);
    }
    }
    }

    Attached Files Attached Files

  5. #5
    Senior Member
    Join Date
    Jan 2003
    Location
    Nebraska
    Posts
    448
    Man, what a mess for something that at once seemed so simple heh. Thanks a ton for the help! I'll go and try this out.
    ecards - My full flash site.

  6. #6
    Senior Member jbum's Avatar
    Join Date
    Feb 2004
    Location
    Los Angeles
    Posts
    2,920
    A simpler fix might be to leave the clips unnested as you had them, and ignore the rollout event for your outer movie if you are still getting a hitTest on the mouse.

    So your outer rollout handler would look like this:

    code:

    on(rollOut)
    {
    if (!this.hitTest(_root._xmouse, _root._ymouse))
    {
    // mouse is outside of movie...
    // handle rollout normally
    }
    }



    This also has the advantage of not sucking your CPU with a needless onEnterFrame handler.

  7. #7
    Senior Member
    Join Date
    Jan 2003
    Location
    Nebraska
    Posts
    448
    Thanks, that works alot better. I had to get rid of the fade into black and white effect in order for it not to start the fade when you roll off the inside clip, but better than having the messy onEnterFrame script.
    ecards - My full flash site.

  8. #8
    Junior Member
    Join Date
    May 2006
    Posts
    1
    man, thanks so much for your code! i was struggling for needless hours trying to figure out why a rollover within a rollover didn't work! seemed like a pretty obvious thing that a newbie might try to do, so i'm not sure why flash doesn't support it. isn't this simply "recursion", which i thought was one of the fundamental and wonderful things about programming languages?

    anyway... to add to the discussion, what if you wanted to make the inner rollover as described in this thread also clickable, so that you not only can rollover it to make it's color change, for instance, but if you click on it, it calls the getURL method?

    please advise! thanks.

  9. #9
    Member
    Join Date
    Sep 2006
    Posts
    44
    can anyone help what is the meaning of nested if statement under
    if (this.hitTest(_root._xmouse, _root._ymouse, true)) {

    the if statement here? what is the purpose of it especially the this.isRollOver
    }

    Sorry im not incompetent in flash... Im newbie in actionscript...

  10. #10
    Senior Member
    Join Date
    Jan 2003
    Location
    Nebraska
    Posts
    448
    Um, are you looking to do something specific? Not sure if I understand your question.
    ecards - My full flash site.

  11. #11
    Member
    Join Date
    Sep 2006
    Posts
    44
    what does this do? what is !this.isRollOver? is this reserved word or what..

    if (!this.isRollOver)
    {
    this.isRollOver = true;
    trace("inner rollover: " + this);
    }
    }
    else {
    if (this.isRollOver)
    {
    this.isRollOver = false;
    trace("inner rollout: " + this);
    }

  12. #12
    Senior Member
    Join Date
    Jan 2003
    Location
    Nebraska
    Posts
    448
    this.isRollOver is a variable. If it's false or non-existant then it is set to true where it says this.isRollover=true;. If it's true then the else runs and it is set to false. It's just coded to use as a toggle.
    ecards - My full flash site.

  13. #13
    Member
    Join Date
    Sep 2006
    Posts
    44
    Sorry if im asking this question... Im still little confused.. if this is a variable where is the declaration of it and the boolean value of it at first.. I mean where did it get its first value (whether true or false) to validate the if statement.. thanks hope you can help me understand this...btw this is my problem, i have a flash project which troubling me on nested rollOver.. This is the scenario. I have put a onRollOut button state a movieclip.. which under that movieclip i have a invisible button named (btnInvi) which triggers the a movieclip to play everytime you rollover on that invisible button... Actually this whole thing is some kind of drop down menu.. Now the problem is it is not detecting the rollover state as the problem here also.. but the difference is im using invisible button to trigger the movieclip to play which is below a movieclip which has onRollout state.. can u advise me.

  14. #14
    Senior Member
    Join Date
    Jan 2003
    Location
    Nebraska
    Posts
    448
    The default value for a variable that hasn't been declared is 'undefined'. But when using (if variable) {, the if will evaluate false for both the value "FALSE" and for "undefined", so the code works and has the variable at false first, but the variable probably should be declared first for readablitity, it's just lazier to do it that way.
    As far as the second part of your question, I'll see if I can answer it later when I'm not so tired heh.
    ecards - My full flash site.

  15. #15
    Member
    Join Date
    Sep 2006
    Posts
    44
    now i know... thank you for that clear explanation Mctitles. I really appreciate your help and time your giving..

  16. #16
    Senior Member
    Join Date
    Nov 2001
    Posts
    1,145
    Hey, just wanted to get in on this.

    You can also create some variables to monitor things.

    For mctittles picture thing, I'd make up a var like mainPicStatus.

    mainPicStatus = "color";
    or
    mainPicStatus = "bw";

    That'd mean it's black and white which means it has been moused-over. If you're doing a mouse over on a hotspot now, the hotspot can simply check mainPicStatus and leave the picture the way it is.

    So no matter where, or what, you're mousing over or off of, you can simply check mainPicStatus to see what to do or not to do.

    on (rollOver) {
    if(mainPicStatus == "color"){
    // do something here because you know the picture is color
    }
    }

    Put these variables in the root movie so they're available from anywhere in the movie using _root. in front of it.

    Meaningful vars like these help keep the programming clear and literal.
    Last edited by moot; 09-23-2006 at 09:51 AM.

  17. #17
    Member
    Join Date
    Sep 2006
    Posts
    44
    that is easy but what if the problem is that you need to detect a rollOver over a two lower movieclip below the _root.. like

    _root.mcClip.mcClip2.mcClip3 (nested)

    which the mcClip2 has a rollOut state and mcClip3 has a rollOver state also that everytime you rollOver on it plays animation in that movieClip. the purpose of the rollOut state in the mcClip2 is to play the gotoAndStop which close the whole movie... which is on frame 1.. and in the root timeline i have also 5 main navigation button which is the same situation as like this.. can anyone help me...

  18. #18
    Senior Member whispers's Avatar
    Join Date
    Mar 2001
    Location
    CFA2h (respect the HEX)
    Posts
    12,756
    anything under A rollover..will NOT be 'seen' as the ROLLOVER is in EFFECT...so the rollovers you have UNDERNEATH this rollOver..wont be triggered..cause thr first/top ROLLOVER is still in effect..and will be until the ROLLOFF effect is triggered. if you want to trigger anyting UNDER a ROLLOVER at the SAME time..then you need to use a HITTEST method..(as stated above)

  19. #19
    Senior Member
    Join Date
    Nov 2001
    Posts
    1,145
    you can use invisible buttons too - buttons with only the hit frame filled in

    you can make your invisible buttons in any shape and put them on any layer you need including the top layer

    take the rollovers and rollouts that are being buried and put them on invisible buttons on the top layer.

  20. #20
    Junior Member
    Join Date
    Dec 2007
    Posts
    8
    just reiterating gazoings comment -
    what if you wanted to make the inner rollover as described in this thread also clickable, so that you not only can rollover it to make it's color change, for instance, but if you click on it, it calls the getURL method?

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center