Rollover within Rollover?

[Mctittles]

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.

[jbum]

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

[Mctittles]

Currently they are like the second option you listed, although I have tried both ways with no luck.

[jbum]

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);

		}

	}

}

---

[Mctittles]

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.

[jbum]

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.

[Mctittles]

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.

[gazoing]

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.

[shendel101]

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...

[Mctittles]

Um, are you looking to do something specific? Not sure if I understand your question.

[shendel101]

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);
}

[Mctittles]

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.

[shendel101]

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.

[Mctittles]

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.

[shendel101]

now i know... thank you for that clear explanation Mctitles. I really appreciate your help and time your giving..

[moot]

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.

[shendel101]

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...

[whispers]

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)

[moot]

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.

[expansion17]

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?