Flash Elements were introduced in Dreamweaver MX 2004. Flash Elements allow you to quickly add Flash content to your page from within Dreamweaver. Currently the only flash element that comes packaged with Dreamweaver is the Image Viewer. The Image Viewer quickly assembles a highly customizable album. This tutorial will show you how.

First Things First
First, define a web site. If you don't know how to define a site.. Check the Dreamweaver MX help files. To do this go to HELP/GETTING STARTED AND TUTORIALS click the CONTENTS tab and choose "Quick Site Setup" and read the section titled "Define a Dreamweaver site". This is required to handle the image paths better. Open a New Document (Crtl+N). Change your Insert bar to 'Flash Elements' as shown below.

You would now see the Image Viewer Icon on the Insert Bar. When you click on the icon, you are prompted to save the Flash file. Name your file and save it.

You will see the swf inserted in Dreamweaver. Also you will see the property inspector for the Image Viewer.

Click the Play Button to see the image viewer. You will notice that since we have not specified our images, the image viewer currently shows only the navigation elements.

Let us now specify our images. To do so open your "Tag Inspector (F9)"

To specify your images click the edit icon on imageURLs. Click the folder icon to browse to your images one by one. Click the +/- icons to add or remove an image.

You may want to link the Images to a URL. Click the edit icon on imageLinks.

You can either browse to a link within your site of specify an absolute URL.

You may also add captions by clicking the edit icon on imageCaptions.

Since our images are 335 x 600 px, We can specify the width and height of our flash element add some space for borders and frames in the Properties Inspector. Since our images are 335 x 600 px, We can specify the width and height of our flash element add some space for borders and frames in the Properties Inspector.

Spice It Up
You can spice up the image viewer as follows:

Background Color
Select a color using the color picker on bgColor

Captions
captionColor, captionFont, captionSize style your captions

Frame
To show a frame around your image viewer select frameShow as 'Yes', frameColor and frameThickness further style the frame.

Transitions
Select a transitionsType from the drop down

Title
title, titleColor, titleFont, titleSize style the title of your Image show

Controls
showControls will show or hide controls, slideAutoPlay, slideDelay and slideLoop will further control the way your image viewer behaves.

• Figure 1
• Figure 10
• Figure 2
• Figure 3
• Figure 4
• Figure 5
• Figure 6
• Figure 7
• Figure 8
• Figure 9