Intriguing Question on Navigation System 3

[TulsaJeff]

Ok... I have a question. I was looking at a site today and for the life of me I cannot reproduce their navigation system.

Someone go look at

http://www.genejuarez.com/launch.html

and see if you can shed some light on this. this site was brought up in a previous post and I was intrigued by the navigation.

Here is the real intriquing part... it looks like the one toolbar is sliding out as another is sliding in... without making 25 different variations of toolbars how are they making the correct one exit and another one enter at the press of any given button.

Also each toolbar is different... the button that was pressed... once its toolbar enters then that button is no longer "hot" adding another dimension to this scenario... and the sequence of the buttons have changed upon each press.

Every button clicked calls a separate movie into the shell...are the toolbars all contained in the shell movie or is each one contained within the respective loaded .swf?

Are they doing this with scripting or are they using lots of tweens?

I guess I am just trying to see what would be the most logical approach to creating something like that. I need ideas and suggestions. It looks simple but after working about 6 hours trying to reproduce it and getting so confused that I am not sure which button goes with what toolbar I have decided to ask you guys. Regards,
TulsaJeff

 

[oldnewbie]

Interesting challenge! Nukoi must already be on the case... You should have a working example within the hour!

Seems to me it's through actionscript, because of the tapering movements. There's also a pattern to it... Notice how when selecting any given button, in any position, the previous selection ends up in the right most position. Also seems to me, independent of the loaded movies as such... Must be in the main movie!

Got to get back to work... Delivery tomorrow morning!
Will follow up on this... Interested in what others may figure out!

Regards,

 

[Nukoi]

Are you making fun of me oldnewbie?? =)

Well... I am a little bit druknright now but I can give it a shot if you rally want me to.. -Nukoi
I know my stuff.. Hire me.

http://www.nukoi.com

 

[oldnewbie]

I'll drrrunnnkkk to that!

Regards,

 

[Nukoi]

Soprry to dissapoint you but it'll have to wait until i wake up.. I am not in the frame of mind to do it right now.. I have it 3/4 done but i cant debug and troubleshoot like this =) goodnight guys. -Nukoi
I know my stuff.. Hire me.

http://www.nukoi.com

 

[TulsaJeff]

Thanks for all the help guys... I am looking forward to seeing what you guys come up with Regards,
TulsaJeff

 

[Nukoi]

Hi Jeff..

Just woke up and figured out where the bug came from last night.. Anyways, here is my recreation of their navigation system.. Hope this helps..

http://www.nukoi.com/tek-tips/nav_gene.zip

Let me know if you have any questions.. Its fairly intuitive. -Nukoi
I know my stuff.. Hire me.

http://www.nukoi.com

 

[TulsaJeff]

I will take a look.... thanks for the help Nukoi and you too Old for your wise insight I can always depend on;-)

OK... I am starting to sound like Steve... but that's about as close as I am getting to saying I love anyone in hereX-) Regards,
TulsaJeff

 

[Nukoi]

You're welcome Jeff.. Anything to help the fellow man.. haha -Nukoi
I know my stuff.. Hire me.

http://www.nukoi.com

 

[TulsaJeff]

I hate to say it but I am still a bit confused, not as much but I do have many questions... I have been studying your script but since scripting is not my forte yet it is a little overwhelming at the moment...

I think I understand the scripting within each frame or clip but I am having trouble with how you are making it change from section1 to section3 or section 4 or whatever. It is not a dynamic textbox yet the text is changing...

I understand that you are looking at the width of the buttons and doing some math to put it into place... I understand the setting of variables and using those variables within the script but this thing is 7 levels deep at times....

this will do me no good unless I can get it in my head and understand what is doing what and why...

Let me ask you this... say I wanted 7 buttons instead of 6, what would I have to change?

Say I wanted the button all the way to the right to no longer be hot when I was in that section, what would have to be changed to accomplish that? Regards,
TulsaJeff

 

[Nukoi]

Okay.. -Takes a deep breath-

The way I did the buttons changing to section 1-6 was like this...

Made a movie Clip... gave it an instance name of 1.
Made a button inside that movie clip..
The buttons text is actually a movieclip of text..
That movieclip has 7 frames (the first one doesnt matter what is on it- it could be left blank if you wanted to)..
Frames 2-7 have the section names on them..
The action on the first frame tells it to go to whatever the name of our original clip was (1 in this case) plus 1, so it goes to frame 2..

Now we take our original movie clip, copy/paste it and give it an instance name of 2... So in the section part will land on frame 3 (2+1)..

You can add or subract buttons as you like, just add/subract a frame in the movie clip inside the button.. Make sure that the movie clip instance names are incremental (1 thru x) and dont skip any numbers .

Reason for doing it that way:
All of the buttons have the exact same action.. You dont need to copy/paste actions and you dont have to change it in 7 places everytime you need to make an edit to the functionality..

If you have aim or yahoo messenger or anything like that, I might be able to better explain it, and we can drill down on the parts that are confusing to you..
-Nukoi
I know my stuff.. Hire me.

http://www.nukoi.com

 

[Nukoi]

Im sorry if my script is a little overwhelming, but dynamic animation and things of that nature tend to look confusing to anyone other than the person who wrote them -Nukoi
I know my stuff.. Hire me.

http://www.nukoi.com

 

[wangbar]

Here's an alternative way to get a similar effect.

http://www.wangbar.co.uk/jeffButton.html

(change the file extension to download the .fla)

It solves the problem of the button being "hot" when selected by turning each separate button into a clip with a second frame which is just the highlighted text. The wraparound kind of switches clips on and off at the moment, this could be made smoother by using duplicate and remove movieclip actions to add a "phantom" sixth clip but that seemed a bit overcomplicated for this example.

The code's pretty centralised (the "W" logo at the top and a couple of actions on the buttons) and it's heavily commented so it shouldn't be too hard to follow.