Creating

Flash is no longer just a program that you use to create cool special effects and animations. Flash is used extensively for navigation and other interactive purposes. A key facet to navigation is hyperlinks. You are familiar with hyperlinks in browsers; you click on a link and a page loads. Flash, on the other hand, works differently.

Creating a hyperlink is not too difficult, but it does require some moderate degree of effort until you get used to hyperlinking Flash. This tutorial will help you get introduced to the 'art' of hyperlinking in Flash!

[ click the Flash button above ]

Creating a Hyperlink:
The following steps will guide you in creating a hyperlink:

1. Create a new document in Flash MX by going to File | New. A new, blank Flash MX movie will be displayed.
    
2. From the Tools panel, click the Oval Tool and draw a circle in your drawing area. Once the circle has been drawn, select the circle with your mouse pointer.

[ circle after having been selected ]

3. Once the circle has been selected, press F8 or go to Insert | Convert to Symbol. The Convert to Symbol dialog box appears. In the Name field, give this circle a name. I will call this circle "Hyperlink". In the Behavior section, select the Button option. Your Convert to Symbol dialog box should look like the following image:

[ circle after having been selected ]

4. Press OK to close the Convert to Symbol dialog box. The circle is now a button. Right click on the circle and select Actions. The Actions panel will expand for you to input actions.
    
5. From the Actions panel, click on the plus symbol ( + ) found near the middle of the panel. Once you click the plus symbol, go to Actions | Browser/Network | getURL.
    
6. You will see the URL, Window, and Variables field displayed in your Actions panel. In the URL field enter: http://www.kirupa.com. Click the Window field/drop-down menu and select _blank. Your Actions panel will look like the following image:

[ the action panel after filling in the fields ]

7. Save the file and preview the animation in your browser by going to File | Publish Preview | HTML. Click on the button, and you will see a new browser window open.

Window States
You may have noticed, that when the button was clicked, it opened a page in a new window. Sometimes you may not want every link to open in a new window. Maybe you want the link to open in the current window. That is where the Window field of the button Actions plays a large role.

In this tutorial, you clicked the Window drop-down menu/field and picked _blank from one of four choices. To make it easier for you understand the Window states, I have provided a brief explanation about each selection in Window drop-down menu:

• _self
  Loads the link in the current page or the current page in a Frame. This is the default selection used by Flash to open any link.
   
• _blank
  Loads the link in a separate browser window. You selected _blank in the tutorial above.
   
• _parent
  Loads the link into the frameset file of a frame. The frameset file controls all the frames, and setting the window to _parent will eliminate frames in the subsequent links. As you may have seen, often times, links get loaded inside frames unintentionally. Setting _parent will solve the misuse of frames!
   
• _top
  Loads the link on the top frame.

If you are curious as to how my FLA looks like, click the link below. You should note that my version of the FLA is an exact replica of the example you saw near the top of this page. In other words, the FLA contains the 'click the button' text and buttons states!

download fla

I hope the information helped. If you have any questions or comments, please don't hesitate to post them on the kirupa.com Forums. Just post your question and I, or our friendly forum helpers, will help answer it.

The following is a list of related tutorial and help resources that you may find useful:

How to use the Forums New, Upcoming, and In-Progress Tutorials How to Help out kirupa.com Writing Tutorials

Cheers!
	Kirupa Chinnathambi kirupaBlog