?
Solved

Simple Flash Slideshow with Hyperlinks

Posted on 2009-04-26
8
Medium Priority
?
1,815 Views
Last Modified: 2012-05-06
I have created a very simple slide show in flash cs4. It consists of 4 slides with a classic tween effect between each slide.

What I would like to do is link each of the four slides to the webpage related to the slide.

Can anyone tell me how to do this with flash cs4?
0
Comment
Question by:michaelgoldsmith
  • 4
  • 4
8 Comments
 
LVL 4

Expert Comment

by:slovisa
ID: 24236504
In each slide, just add a new layer with an invisible button.

To create the button: Create the size/shape you need; Convert the shape to a button symbol; Edit the symbol - cut the shape from the first frame, create a keyframe on the last frame (hit state) and paste in place in that last keyframe.

Then give your button an instance name (e.g. "button1") and add the hyperlink code to your actions layer (recommended):
button1.onRelease = function(){
      getURL("http://www.somesite.com");
}

Or you can attach the code to the button itself:
on (release) {
      getURL("http://www.somesite.com");
}
 
0
 
LVL 12

Author Comment

by:michaelgoldsmith
ID: 24236994
Very new to flash, but here is what I did in following your directions:
1. Added a new layer at the top named "links".
2. Highlighted the first frame and created a rectangle shape the same size as the stage.
3. hit F8 and converted to a button symbol called button1.
4. Set the alpha to 0%.
5. created a keyframe in frame 65 (the last frame if the first photo).
6. added an actions layer.
7. Pasted the code above into the first frame of the actions layer.

Now what? So far it does not work.
0
 
LVL 4

Accepted Solution

by:
slovisa earned 2000 total points
ID: 24237880
OK, I'll need to break these steps down in more detail. Let's start with what you've already done:

1. good. it's a good idea to always keep your actions together in one frame at the top. usually called "actions." You can keep your actions in the "actions" layer, and probably need to create a separate "buttons" layer for the button MCs.
2. i assume you're talking about frame 1 of the main animation - that's fine. Doesn't matter where this shape is originally created.
3. good.

After that...sounds like you're off track. I was assuming each slide was it's own animation - but if it's all just one sequential animation, it will work very much the same way. Here's what you need to do...

Undo your steps 4-7 above.

4. Double-click your button instance to edit the button MC. Here inside your button is where you cut the shape out of the first frame; then create a keyframe in frame 4 (the "hit" state) and paste your shape in place here. Now exit back out to your main animation.
5. Drag the instance of button1 to it's proper place in frame 1, covering your whole first slide. Make sure it's in your "buttons" layer and make sure it's named "button1."
6. Create keyframes at the beginning of each slide. If your slides are 65 frames long and you have 4 of them, create keyframes at 66, 131 and 196.
7. Drag new instances of the button MC into the keyframes at 66, 131, 196 on the buttons layer.
8. In frame 1 of the actions layer, and the following code:
button1.onRelease = function(){
      getURL("http://www.yourURL1.com");
}
button2.onRelease = function(){
      getURL("http://www.yourURL2.com");
}
button3.onRelease = function(){
      getURL("http://www.yourURL3.com");
}
button4.onRelease = function(){
      getURL("http://www.yourURL4.com");
}
9. Now test. That should do it?
0
Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

 
LVL 4

Expert Comment

by:slovisa
ID: 24237882
Oops. Add to step 7 - Name each button instance: frame 66="button2", frame 131="button3", frame 196="button4".
0
 
LVL 12

Author Comment

by:michaelgoldsmith
ID: 24881678
Just getting back to this project today.

I followed your steps and everything looks like it is going to work, but when I preview in HTML, clicking on the slideshow does not send me to the URL.

I get the following "compiler errors":

Location: Scene 1, Layer 'actions', Frame 1, Line 1
Description: 1120: Access of undefined property method button1.
Source: button1.onRelease = function(){
NOTE: repeated for each button....

Location: Scene 1, Layer 'actions', Frame 1, Line 2
Description: 1180: Call to a possibly undefined method getURL.
Source: getURL("http://www.theURL.com");
NOTE: repeated for each URL....

Location: Scene 1, Layer 'actions', Frame 1, Line 2
Description: Warning: 1160: Migration issue: The method getURL is no longer supported.
NOTE: repeated for each URL....
0
 
LVL 4

Expert Comment

by:slovisa
ID: 24881998
Oh yeah... I think that you need to edit your settings to publish using AS2. I believe AS3 gets rid of the "getURL" action and makes that behavior a bit more complicated.

If you need to publish in AS3 for some reason, let me know and I'll post revised code - but with such a simple slideshow AS2 should work just fine.
0
 
LVL 12

Author Comment

by:michaelgoldsmith
ID: 24882038
I have already switched it to AS2. Now I do not get any compiler errors, but I still can't click the slideshow and get to the URL.

HEEEEEEELLLLPPPPP....
0
 
LVL 12

Author Comment

by:michaelgoldsmith
ID: 24882713
http://www.flash-here.com/tutorials/flash_hyperlink_btn.html

Followed this quick tutorial to get it all straight. Thanks for the help.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This is a very simple example to help those of you who are still migrating from AS2 to AS3 understand the redesigned event model in AS3. In AS2.0, event functions (that is, the function to be performed when an event is fired) were stored as a pro…
I have found that much of my time doing support ends up being a constant repetition of the same steps to different people.  Early on I stated using web pages with Frequently Asked Questions (FAQs) to alleviate most of the burden.  Sometimes this jus…
In this tutorial viewers will learn how to create a basic shape tween animation in Flash including shape hints for smooth animation Open a new document in Flash: Draw a shape: Select another frame (how long you want the tween to be): Right click and…
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.
Suggested Courses

807 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question