Animated Smartclip Navigation Tutorial

There is a tutorial on Kirupa.com called Animated Smartclip Navigation. It can be found here: http://www.kirupa.com/developer/mx2004/ani_smartclipnav.htm

The premise is creating one button instance, and then defining it as a component, in order to use it multiple times. The author of the tutorial says that when using these buttons for a menu, simply place invisible buttons over the top, so each button can have a unique command. The trouble is, when i do this, the animations no longer play. Have i missed something??

:-/

i recently found that and was experimenting with it and mine play fine…
u wanna post an fla or sumit?

Prophet.

PS note im NOT using mx2004 :wink:

Here is a Flash which is nearly identical to the tutorials source files. The only difference is that there is three invisible buttons on the level above the smartclips…

<—uses Flash MX, too

:toad:

it makes sense wen u think about it:
you have a button that does the rollover anims actually in the component and you have more buttons over the top of those.
hence the top layer of buttons is obstructing the buttons controlling the rollover anims… a solution i thought of wen fiddling with this same tut is to have the buttons that control the rollover anims an extra action:

on(press){
	_root[func]()
}

and in the component definition window add in a variable named func and add in a function on the _root timeline of what you want to do (ie. with a name testing) and put in your properties inspector for your smartclip the value testing under your new entry… i hope you followed that…

it does work - i use it!! lol
ive no idea what the author REALLY meant… because surely he cant have said that in honesty??? :wink:

Prophet.

Im not too familiar with AS and functions… Ill see what i can come up with, but some step by step instructions or even a FLA would help me out…

apologies about the drama on the third button :blush: lol

i just went into the component (or smartclip)
took the button layer and unlocked it, selected the invisible button and applied this code:

on (press) {
     _root[Fpress]()
 }

and added in a new variable to the component in component definition which states the name of the function to call when you press the button and labelled this variable Fpress

i then declared a function for each button on the _root timeline and hey presto :wink:

Prophet.

sweet… thanks a lot… this will come in handy when making navigation in the future…

again, thanks a lot!!

not a problem :slight_smile:

Prophet.

I was looking for that answer too! Thanks
But I have another question regarding smart clips.
Is it possible to make the button to stay in the OVER state when clicked and to go back to the initial state when another buttons is pressed?

yes.
have the press function set a variable = 1. then in your smartclip code on the onRollOut operation, wrap an IF statement around the rollOut code to check if this variable != 1 before it does it. then on your other button that you want to initiate its rollOut anim, set the variable to 0 and then just use simple animation/path code suchas mySmartClip.gotoAndPlay(“frameLabelRepresentingTheRollOutAnim”)

Prophet.

EDIT:- majeye, i just saw your footer… FANTASTIC!!! lol

prophet
thanks i had also been trying to get this to work … and now im having trouble getting this last part of getting the selected button to stay in a specific state …
not the best with the a.c. so could you help out a little more with the actual code to get this to work?
thanks in advance
sky_vault

ne more requests? :wink:

Prophet.

PS i wrapped an if around the rollOver action as well and made the variable a global variable making use of the ._name property for a smaller code

Great nav Prophet!! thanks!!!

lol i didnt make it, i just tweaked it :wink:

but no probs! :slight_smile:

Prophet.

Yeah I know;) But love the tweaks!

ThankYou!!! Go Prophet!!!

Did find one more issue with these crazy little smartclips that are supposed to help making a nav an easy task:sure: in the down state if press on the button again it will play through the closing “Stop” animation while staying the selected button … But thanks to prophets GREAT tweaks I was able to add a tweak of my own that seems to solve this problem … just added a global var to the press function inside the clip and now when pressed it is disabled until another instance is pressed!!! Thanks again prophet for you showed me something that three different books could not!!!

Don’t know if anyone has done this on their posted flash (cuz i haven’t looked at any) But here’s a way:

Add the code on the invis button inside the smartclip (the same one used for the rollOver and Outs) :

 
on (release) {
	getURL (site, "_blank");
}

and on the component definition thing you can put the variable as site and then enter eg: “http://www.kirupa.comwith quotes!

If you get what i mean :slight_smile:

or… u could use my method i posted earlier and do a thousand differnt things :wink:
wat i did was to call a function defined on the _root level, the name of which is entered by the user on the property inspector so they can then write

function Mini(){
getURL ("http://www.kirupa.com", "_blank")
trace("this site rocks")
}

, write the word Mini in the component definition and hey presto u got the same thing but with much more variability possible :wink:

Thanks again prophet for you showed me something that three different books could not!!!
:smiley: really?? COOL!!
cheers, just happy 2 help :slight_smile:

Prophet.

PS

ThankYou!!! Go Prophet!!!
go me! :slight_smile: lol [apology=“Prophet”]sorry im in a funny mood :S lol[/apology]

The navigation is working fine now! thanks to everybody.

I was trying to make the buttons label to tint when on rollover to change color gradually. Is it possible?
Thanks