Copy link to clipboard
Copied
Hi friends,
I am trying to create a flash navigation bar for the first time and i have problems making it work the clicked state wont stick! I've looking thru tons of tutorials and only found 1 that ALMOST fits my need. Im lost in the never ending google and i really cant find the help i need to make it work so here i am.
Here goes my problem i hope someone can help me out, i am very new to flash so please consider that if you want to help me out.
I have created a navigation bar with 5 buttons made of movie clips each containing 4 states labeld up, over, out and clicked. When i test the navigationbar inside flash it works fine because it does not reload when i click a button as it would on the website where the whole page reloads. But on the website when im testing it the button state "clicked" just wont stick and i understand why, because the page is reloading and my script tells all the buttons to return to "up" state when the flash starts. But i would like them to stick... and i dont know how to do it really. I would love if there was a way to make so when i click the button the flash does not reload when im trying to grab my main content but im not sure if its possible. Or maybe so that the script checks what page i am on and activates the "clicked" state that way... Im not sure to be honest.
Here is my action script for my navigationbar. Please help me..
button1.buttonMode = true;
button2.buttonMode = true;
button3.buttonMode = true;
button4.buttonMode = true;
button5.buttonMode = true;
function allButtonsUp(): void {
button1.gotoAndStop("up");
button2.gotoAndStop("up");
button3.gotoAndStop("up");
button4.gotoAndStop("up");
button5.gotoAndStop("up");
}
function allButtonsOver(): void {
button1.addEventListener(MouseEvent.MOUSE_OVER,
overFunction);
button2.addEventListener(MouseEvent.MOUSE_OVER,
overFunction);
button3.addEventListener(MouseEvent.MOUSE_OVER,
overFunction);
button4.addEventListener(MouseEvent.MOUSE_OVER,
overFunction);
button5.addEventListener(MouseEvent.MOUSE_OVER,
overFunction);
}
function allButtonsCLICK(): void {
button1.addEventListener(MouseEvent.CLICK,
clickFunction);
button2.addEventListener(MouseEvent.CLICK,
clickFunction);
button3.addEventListener(MouseEvent.CLICK,
clickFunction);
button4.addEventListener(MouseEvent.CLICK,
clickFunction);
button5.addEventListener(MouseEvent.CLICK,
clickFunction);
}
button1.addEventListener(MouseEvent.CLICK, Home);
function Home(event: MouseEvent): void {
navigateToURL(new URLRequest("?page=home"), "_self");
}
button2.addEventListener(MouseEvent.CLICK, Register);
function Register(event: MouseEvent): void {
navigateToURL(new URLRequest("?page=register"), "_self");
}
button3.addEventListener(MouseEvent.CLICK, Ranking);
function Ranking(event: MouseEvent): void {
navigateToURL(new URLRequest("?page=ranking"), "_self");
}
button4.addEventListener(MouseEvent.CLICK, Downloads);
function Downloads(event: MouseEvent): void {
navigateToURL(new URLRequest("?page=downloads"), "_self");
}
button5.addEventListener(MouseEvent.CLICK, Donate);
function Donate(event: MouseEvent): void {
navigateToURL(new URLRequest("?page=donate"), "_self");
}
function allButtonsOut(): void {
button1.addEventListener(MouseEvent.MOUSE_OUT,
outFunction);
button2.addEventListener(MouseEvent.MOUSE_OUT,
outFunction);
button3.addEventListener(MouseEvent.MOUSE_OUT,
outFunction);
button4.addEventListener(MouseEvent.MOUSE_OUT,
outFunction);
button5.addEventListener(MouseEvent.MOUSE_OUT,
outFunction);
}
allButtonsUp();
allButtonsOver();
allButtonsCLICK();
allButtonsOut();
function overFunction(e: MouseEvent): void {
e.target.gotoAndStop("over");
}
function outFunction(e: MouseEvent): void {
e.target.gotoAndStop("up");
}
function clickFunction(e: MouseEvent): void {
allButtonsUp();
allButtonsOver();
allButtonsCLICK();
allButtonsOut();
e.target.gotoAndStop("clicked");
e.target.removeEventListener(MouseEvent.MOUSE_OVER,
overFunction);
e.target.removeEventListener(MouseEvent.MOUSE_OUT,
outFunction);
}
Copy link to clipboard
Copied
in your clickFunction, send all movieclips to their 'up' frame and re-enable them before directing e.currentTarget to it's 'clicked' frame and disabling it.
to enable/disable:
whatever.enabled=true;
whateverelse.enabled=false;
Copy link to clipboard
Copied
I dont understand the code enough my self to get what you just told me, i followed a tutorial to get this to work. Im sorry..
could you be the best to rephrase it or maybe exband and explain a bit more what you're trying to say. This is my friend the first actuall flash object i've ever created..
Copy link to clipboard
Copied
try:
var buttonA: Array = [button1, button2, button3, button4, button5];
var pageA:Array = ["home","register","ranking","downloads","donate"};
var previouslyClickedButton:MovieClip;
buttonListeners();
function buttonListeners(): void {
for (var i: int = 0; i < buttonA.length; i++) {
buttonA.addEventListener(MouseEvent.MOUSE_OUT, outFunction);
buttonA.addEventListener(MouseEvent.MOUSE_OVER, overFunction);
buttonA.addEventListener(MouseEvent.CLICK, clickFunction);
buttonA.buttonMode = true;
}
}
function overFunction(e: MouseEvent): void {
e.currentTarget.gotoAndStop("over");
}
function outFunction(e: MouseEvent): void {
e.currentTarget.gotoAndStop("up");
}
function clickFunction(e: MouseEvent): void {
navigateToURL(new URLRequest("?page="+pageA[buttonA.indexOf(e.currentTarget)]), "_self");
if(previouslyClickedButton){
previouslyClickedButon.enabled=true;
previouslyClickButton.gotoAndStop("up");
}
MovieClip(e.currentTarget).enabled = false;
MovieClip(e.currentTarget).gotoAndStop("clicked"); |
previouslyClickedButton=MovieClip(e.currentTarget);
}
Copy link to clipboard
Copied
Well the code works without errors except a typo, but everytime i reload now all the buttons are spamming untill i mouse over them. None sticks now.
But wow that was very kind of u to write me something like that, looks alot better too, im sure i was watching an outdated tutorial.
Copy link to clipboard
Copied
if none of your button movieclips have a stop() in their first frame, use:
var buttonA: Array = [button1, button2, button3, button4, button5];
var pageA:Array = ["home","register","ranking","downloads","donate"};
var previouslyClickedButton:MovieClip;
buttonListeners();
function buttonListeners(): void {
for (var i: int = 0; i < buttonA.length; i++) {
buttonA.gotoAndStop("up");
buttonA.addEventListener(MouseEvent.MOUSE_OUT, outFunction);
buttonA.addEventListener(MouseEvent.MOUSE_OVER, overFunction);
buttonA.addEventListener(MouseEvent.CLICK, clickFunction);
buttonA.buttonMode = true;
}
}
function overFunction(e: MouseEvent): void {
e.currentTarget.gotoAndStop("over");
}
function outFunction(e: MouseEvent): void {
e.currentTarget.gotoAndStop("up");
}
function clickFunction(e: MouseEvent): void {
navigateToURL(new URLRequest("?page="+pageA[buttonA.indexOf(e.currentTarget)]), "_self");
if(previouslyClickedButton){
previouslyClickedButon.enabled=true;
previouslyClickButton.gotoAndStop("up");
}
MovieClip(e.currentTarget).enabled = false;
MovieClip(e.currentTarget).gotoAndStop("clicked"); |
previouslyClickedButton=MovieClip(e.currentTarget);
}
Copy link to clipboard
Copied
Ah i see, its hard for u to know how my layers look like Well now it works, just as the old one tho. The "click" still doesnt stay clicked after clicking a button and moving to a new page and "reloading" the flash.
Copy link to clipboard
Copied
you shouldn't be reloading your menu in those pages, just the page content.
if you are going to reload the menu you'll need to use something like the sharedobject to pass info from one page to another.
Copy link to clipboard
Copied
Well as i described in the first post, i would love if they menu didnt but it does. The main thing i use php dymanic content is because i tought it would avoid the flash reloading everytime i want a new page. It shouldnt in theory because its outside of what updates when i grab for example the ?page=downloads content.... I just dont get it.. Google tells me its impossible to make it not "reload" everywhere i search. Im very greatful for your response and help, i really am. I wish i coudl repay u somehow! If you help me figure this out im in eternal debt to you, this has been bugging me for a good 2 days now and i've been searching nonstop..
Copy link to clipboard
Copied
typically in a flash web site you have a menu at the top or left side (but could be anywhere) that loads content into the stage middle. (here's an example at my web site - http://www.kglad.com).
each button click loads a swf to the middle of the stage and does NOT reload the complete page. ie, the main swf is just the buttons/menu and coding. all the content is loaded into the main swf so the menu/buttons never reload.
Copy link to clipboard
Copied
Just like your website i would want it, but the thing is that my website is based of php files and the only flash is the navigation bar. The ?page=downloads should (and would if i would use a css based menu) only refresh the content in the middle stage but then i cant use the sound effect and other nice motions that comes with the flash menu. What i think is that flash cant refresh the middle content unless its flash too. The navigateToURL DOES refresh the page no matter what to http://fullurl.com?page=downloads instead of just replacing home->downloads and the middle content. I dont think its possible to avoid. That is why i gave up on that idea even tho it would fix it all. Then i thought that maybe in flash it would be possible to check what url is active instead, for the "click" stage, for example if url = "erik.com/home" then activate click stage on home button and so on.
Again, really appriciate you listening and helping me out! Gold worth!
Copy link to clipboard
Copied
you can have your flash menu execute javascript that changes the innerHTML of a central div.
Copy link to clipboard
Copied
I think you'll need to get the URL with ExternalInterface http://circlecube.com/2008/01/get-current-url-to-flash-swf-using-an-external-interface-call/and figure out which button should be down based on which page you're in.
Find more inspiration, events, and resources on the new Adobe Community
Explore Now