In this tutorial, RC covers how to create buttons that call to urls using Action Script 3.
Author: RC Concepcion
Rafael Concepcion (RC) is an education and curriculum developer for the National Association of Photoshop Professionals, and the co-host of Layers TV - The How To Podcast For Everything Adobe. An Adobe Certified Instructor in Photoshop, Illustrator, and Lightroom, RC has over 10 years in the I.T. and ecommerce industries and spends his days developing content for all applications in the Adobe Creative Suite. RC has held training seminars in the U.S., Europe, and Latin America, and recently combined his photographic and web experience to teach with famed wildlife photographer Moose Peterson at the "You Can Do It Too" workshops in Mammoth, CA and at the Voices That Matter Web Conference in San Francisco, CA. RC also writes columns for Layers and Photoshop User magazines.
Thanks for the tutorial. The only thing is I had trouble following your steps as you went. It would help if you could enlarge the video, especially trying to see the Actionscript code.
Can you zoom in on the other lines of code like you did the first one? Or, post that code on the web/blog site?
Hi Gary,
here’s mine:
btn_layers.addEventListener(MouseEvent.MOUSE_UP, goLayersSite);
function goLayersSite(Event)
{
var site = new URLRequest(“http://www.layersmagazine.com”);
navigateToURL(site);
}
Hey Steele76:
Thanks for jumping in there! The only thing that I was going to add from the tutorial standpoint is that the instance name of the button is btn1. In that, make sure that the listener is attached to the correct instance name. For example, if you use a buton called btn1: the listener code would be:
btn1.addEventListener(MouseEvent.MOUSE_UP, goLayersSite);
You rock, though..
but… still can’t see the function code.
Seriously… Ya need to be THAT spoonfed? Two people have ALREADY put the code up here, how about just reading?
this is nice. What I’d like more info on is creating button that maintain a down state until another button is pressed. Any suggestions?
Do you write the Actionscript in the button action. Or in the action layer?
spoon feed me. and I second the “zoom in on script.
thanks
I am a beginner in flash help me to improve my knowledge in actionscript i am preparing myself I found it difficult to understand coding
I’ve began my journey to AS3 with this tutorial. Thank man, nicely done and easy to understand
Do you really expect rockies like me to follow this, the video window is small and you did not even have the common sense to post a test version of the script. The reason why America is so F-uped is bad teachers like you who turn out students that are not prepared for life and get by with mastering 30%. Shame on you, a nasty shame on you
The video window is to small, I advise you to do a text file of the finish action script so I can copy it, can’t quite follow
Hey Joe/Peter:
The code is the third comment on this post. Make sure you check it out.
RC
RC – thank you for being so patient with this. I need to point out that the code in the third comment on this post is *different* than what you used in the tutorial. Could you please post an entry with an exact dulplicate of the code you used during the tutorial? Thank you!
Dwayne
Jason, you didn’t have to come to this site. I guess your personal “Action” script is stuck in an ignorant local view loop. Maybe you should go grab some Flash for Dummies, or a Pocket Manual to Beginners flash if things arent making sense. Its not all the responsibility of the teacher you know, action on your part is the second leg of the race.
Thanks for this, it was a good tutorial. I’m so “green” with Flash and ActionScript. On to my question… how do I add multiple buttons, each with a different URL? I tried making different buttons, each with different instance names, but I keep getting error “duplicate function definition”.
Sorry if this an obvious or stupid question, I just can’t figure it out.
Forget it! I figured it out! woot!
Attached is the code:
btn1.addEventListener(MouseEvent.MOUSE_UP, goLayersSite);
function goLayersSite(Event:MouseEvent):void {
var layersURL:URLRequest = new URLRequest(‘http://www.layersmagazine.com';
navigateToURL(layersURL);
}
Great tutorial and for those who want to be spoonfed…just read a bit more, if you are that lazy don’t bother trying to code, it’s just not for you.
how do I add multiple buttons, each with a different URL? I tried making different buttons, each with different instance names, but I keep getting error “duplicate function definition”.
How did you figured it out! Can you help..
I really need help here.
If I have a button named “MyButton” and I want it to play a Movie Clip on my main timeline called “MyClip”, what is the script I need?
Any help would be appreciated!
Being new to ActionScript 3, this is EXCTLY what I needed! Thanks so much for a fantastic tutorial!!
To DEBOK:
I had the same problem, I figured out that I need to change “goLayersSite” for every button, so for my first button I used “goLayersSite” then in the second button, everytime “goLayersSite” appeared in the code, I just appended a 2 to the end changing it to “goLayersSite2″
third button “goLayersSite3″ etc…
here’s the altered code with that in mind (and my own instance names)
btnaboutus.addEventListener(MouseEvent.MOUSE_UP, goLayersSite2);
function goLayersSite2(Event:MouseEvent):void {
var layersURL:URLRequest = new
URLRequest(“about_us.html”);
navigateToURL(layersURL);
}
Does anybody know how to code this so that the browser does not open the link in a new window?
I want the link to open up in the same page that this flash file is contained within.
Thanks
navigateToURL(layersURL, “_self”);
Have fun! MAS
does anybody know how to create a link between another .swf file using button? (not for web, but for interactive cd)
thx!
3rd Post
URLRequest(”http://www.layersmagazine.com”);
When you give the full url in would it need to be encapsulated in single quotes to make it literal? To keep it from trying to interpret the : in the url.
Hey. What should i do, if I want to load my URL page in a specific region of my HTML site? I can only figure out how to load the new URL in a new or the same browser
clearly explaned BUT i couldn’t see what you were writing.
Hi!
Can you help me!
I’ve made an animated gifbutton in photoshop.
Now I want it to open 3 differents URL when I click the button. Can I do this in Flash?
Can you help me with the code!
Thanks a lot!
I watch you every week on podcast from Sweden!
This has been really helpful. I thank you guys!
Hi,
Can you advise me how to add an expanded navigation list for each button when in “mouse over”.
ie;
There are 8 navigation buttons visible on the index page. I would like the buttons to display several navigation options when individual buttons are in “mouseOver” state. Giving the user perhaps 2 or more options per button.
…so in other words one button becomes, let’s say 5 navigation choices.
Complicated?
Thanks for all help!
But if you wanto do this framevise.
I have a button that i want to go to, lets say, frame 34. How do i write this?
Hey Lasse,
Name the frame by clicking on it and then typing in an instance name. For this example, i’ll use “frame34″ as the instance name of the frame and “mybutton” as the instance name of the button.
function goframe34 (e:MouseEvent):void{
gotoAndStop(“frame34″);
}
mybutton.addEventListener(MouseEvent.CLICK, goframe34);
Hope this is what you were after.
I want to use a button to unload a movie previously loaded on level 2 of my master swf file. How do I do this in AS3/CS4?
I’ve tried saving an old swf file with AS2 preferences in CS4, but it doesn’t work. Actually, the old files still work, as long as I don’t open them & save in CS4. It doesn’t seem to matter what publishing preferences I choose. So it looks like I’m going to need to get friendly with AS3 right away.
Thanks for all of your hard work!
It’s not working for me I keep getting syntax errors on these lines
btn_layers.addEventListener(MouseEvent.MOUSE_UP, goLayersSite);
function goLayersSite(Event)
{
var site = new URLRequest(”http://www.uvreactive.com”);
navigateToURL(site);
}
I am pretty new to Actionscript so far to say I can set up very basic “Event Listeners” to run movie clips etc.
My current project contains a self designed universal power button created originally in Photoshop which I use to fire up a few simple actions.
1. Off 2. Rollover and the colour changes 3. The buttons rollover colour remains but looks as if it’s been pressed. Pretty simple stuff.
However on mouse out, I would like the button to return and stop at the rollover stage (which looks as if the powers on) not the up (off stage).
This button only needs to act once to start the project and never be used again as the site menu kicks in.
example: http://www.pwcreativedesign.co.uk
MAS,
Dude, I need you help i’m having the same prob as Kevin (who’s post you replied to) and you reply while a valid hypothesis didn’t work for me for some strange reason, on the contrary when i click the button on the intro SWF file i expect the result to take me to my main site however it does absolutly nothing. So I was wondering if you could help me out.
Cheers Mate
For those of you who might be having syntax problems using CS4 and Actionscript 3 when trying to implement this code, this might be of some help. I was getting syntax errors on this line:
URLRequest(”http://www.layersmagazine.com”);
but after snooping around and trial and error I found that I needed to replace the ” ” quotation marks with ‘ ‘ apostrophes.
The whole URL will turn GREEN when its correct.
Hopefully this will work for you. I wasted almost 4 hours of my life to get that fucker working!
here is my code but i still cant get it to work
can anyone tell me why?
btn1.addEventListener(MouseEvent.MOUSE_UP, goThomasfranksSite);
function goThomasfranksSite(Event:MouseEvent):void {
var ThomasfranksURL:URLRequest=new URLRequest ;
“http://www.thomasfranks.co.uk”;
navigateToURL(ThomasfranksURL);
}
Hey Guys:
Thanks SOOO much for the Single quotes thing. Sometimes when I am typing out pretty fast, the little things get mucked up.
BL, and several others are absolutely correct. You need the URL in SINGLE QUOTES for it to work. So, if we take Jamie’s example:
btn1.addEventListener(MouseEvent.MOUSE_UP, goThomasfranksSite);
function goThomasfranksSite(Event:MouseEvent):void {
var ThomasfranksURL:URLRequest=new URLRequest ;
‘http://www.thomasfranks.co.uk';
navigateToURL(ThomasfranksURL);
}
Thanks for keeping me honest over here..
RC
Thanks for that RC
but ive placed that in and when testing this keeps coming up
TypeError: Error #2007: Parameter url must be non-null.
at global/flash.net::navigateToURL()
at buttontest2_fla::MainTimeline/goGoogleSite()
what does this mean?
Thanks guys this has been a bitch !!! hate the new AS3, still cant get this to work properly, now my stop action on a movie is not working since i added this code
enterbt.addEventListener(MouseEvent.MOUSE_UP, goLayersSite);
function goLayersSite(Event)
{
var site = new URLRequest(”http://www.lyuy.com”);
navigateToURL(site);
}
i have tried using this.stop but it keeps looping
Thank you for the awesome tutorial, this along with Flash CS4 For Dummies should make me relatively useful in this field. YAY! *Bookmarks on tab bar*
Yeah I keep getting the syntax error too. I tried it with the apostrophes as well as with the quotation marks and neither work for me.
1084: Syntax error: expecting rightparen before colon.
I get similar error messages in Flash CS4 if the url is in double quotes I get an 1804 compiler error and if I go to single quotes I get a different error.
TypeError: Error #2007: Parameter url must be non-null.
at global/flash.net::navigateToURL()”http://www.google.com”
I am brand new to any type of flash but this seems extremely hard to get a simple click to go to a URL
any help appreciated.
got it after playing for a while, need a second pair of () in the code see below – change home to whaterever your instance is called. All I need to do is to get it to open the web page in the same page as the button was on.
home.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
function mouseDownHandler(event:MouseEvent):void {
navigateToURL(new URLRequest(“http://www.google.com/”));
}
can anyone help me to get the button when clicked to open in the same page as the button ? I want to put a navigation bar with 5 buttons onto my web page, I tried the _self tag but it will not work in the above script – I tried
home.addEventListener(MouseEvent.MOUSE_DOWN, mouseDownHandler);
function mouseDownHandler(event:MouseEvent):void {
navigateToURL(new URLRequest(”http://www.google.com/”,”_self”));
}
but only got a syntax error
Jamie:
Try this:
btn1.addEventListener(MouseEvent.MOUSE_UP, goThomasfranksSite);
function goThomasfranksSite(Event:MouseEvent):void
{
var ThomasfranksURL:URLRequest=new URLRequest(‘http://www.thomasfranks.co.uk‘);
navigateToURL(ThomasfranksURL);
}