FluidGrid Flash image Gallery

A dynamic Flash-xml driven image gallery, fully customizable through javascript variables within the html.

DOWNLOAD

Main features

• XML driven
• Configurable via the html document
• Multiple galleries
• Title and description for each image
• Dynamic texts (footer)
• All colors are configured via the html document
• Preloaders for each image and thumbnail
• Uses SWFObject to embed flash

Customization
Fancy horizontal animation on browser resize – values: “on” or “off”

browser_resize_animation = "on";

The directory of the image files (important: keep trailing slashes)

images_directory = "images/";

The total number of galleries

total_number_of_galleries = 8;

Galleries list
Format: “gallery_1″, “gallery_2″, “gallery_3″ etc. for your xml files
Format: “gallery_title_1″, “gallery_title_2″, “gallery_title_3″ etc. for the gallery title

gallery_1 = "xml/animals_birds.xml";

gallery_title_1 = "Animals and birds";

gallery_2 = "xml/landscapes.xml";

gallery_title_2 = "Landscapes";

gallery_3 = "xml/people.xml";

gallery_title_3 = "People";

gallery_4 = "xml/abstract.xml";

gallery_title_4 = "Abstract";

gallery_5 = "xml/cityscapes.xml";

gallery_title_5 = "Cityscapes";

gallery_6 = "xml/computers_internet.xml";

gallery_title_6 = "Computers and Internet";

gallery_7 = "xml/movies.xml";

gallery_title_7 = "Movies";

gallery_8 = "xml/cars.xml";

gallery_title_8 = "Cars";

Galleries title text

title_text = "GALLERIES";

Footer text (you can use some simple html tags like anchors, break lines etc.)

footer_text = "FluidGrid Gallery by malihu - Flash gallery for the masses web: <a href="http://manos.malihu.gr">http://manos.malihu.gr</a> | e-mail: <a onclick="javascript:pageTracker._trackPageview('/mailto/manos@malihu.gr');" href="mailto:manos@malihu.gr">manos@malihu.gr</a>";

Gallery styling
COLORS – format: 0×000000 (e.g. 0xffffff for white, 0xff0000 for red etc.)

page_background_color = "0x000000"; //document background hexadecimal color code

scrollbar_color = "0x666666"; //document scrollbar hexadecimal color code

menu_title_color = "0xffcc00"; //"Galleries" text hexadecimal color code

menu_background_color = "0x333333"; //menu background hexadecimal color code

menu_text_color = "0xffffff"; //galleries titles hexadecimal color code

menu_selected_color = "0x545454"; //selected gallery background hexadecimal color code

thumbnail_background_color = "0x333333"; //thumbnail background hexadecimal color code

image_background_color = "0x333333"; //large image background hexadecimal color code

thumbnail_border = "no"; //Change the borders of the thumbnails - values: "yes", "no" or "0-100" number which indicates opacity (e.g. "50" for 50% opacity of borders)

thumbnail_border_color = "0xffffff"; //thumbnail borders hexadecimal color code

thumbnail_title_color = "0x000000"; //thumbnail title hexadecimal color code

thumbnail_hover_color = "0xffcc00"; //thumbnail background hexadecimal color code on mouse over

image_preloader_color = "0x000000"; //preloader hexadecimal color code

tooltip_background_color = "0xffcc00"; //tooltip background hexadecimal color code

tooltip_text_color = "0x000000"; //tooltip text hexadecimal color code

exit_button_background_color = "0x000000"; //large image "X" button background hexadecimal color code

exit_button_x_color = "0xffffff"; //large image "X" button hexadecimal color code

footer_text_color = "0x999999"; //footer text hexadecimal color code

footer_background_color = "0x333333"; //footer background hexadecimal color code

In order to have the html/css background visible below flash, set wmode parameter and page_background_color values to “transparent”.
XML format

<myItem title="Image Title"

description="Image description"

img="thumbnail_image_filename.jpg"

img_large="large_image_filename.jpg"/>

The only thing to remember in order to use the FluidGrid Gallery is that the thumbnails size must be: 240×150 pixels and optimally the size of the large images should be analogous (ratio: 1.6) to thumbnails (e.g. 1920×1200, 1680×1050, 1280×800 etc.).