Help with creating a photo gallery?

im trying to create a simple photo gallery. all i need to
know is the lingo so that i can rollover a thumbnail of an image
and it appears in place of a black box.... any help would be much
appreciated.

what code do you already have? Maybe we can help you modify
it where it's not working.
Also, how do you have it currently laid out? eg. do you have
several images on the screen, but some method to scroll through
other images? Have you done a search here or on director-online.com
(in the forum or articles section) on similar questions? Do you
have something written up to describe what features you need such
as a design document?
Just trying to get a sense of your level of programming in
general, experience with Director and what planning/details you
have worked out so far because there are so many different ways to
program a gallery.

Similar Messages

Help to create a photo gallery..

Can anyone visit this site..
www.ted.com
I want to create a photo gallery like that.. I mean when i hover my mouse over a thumbnail my image should enlarge.. and if i click i should be able to download..
I want that animation while loading between my galleries..
please help me.. please.. no need that various sizes for all tiles.. no problem even if all tiles are of same size.. please.. I need it so badly..
thanks in advance

Whenever I need a gallery like this i usually just buy one
from:
http://www.flashcomponents.net/component/
they are usually like $8-10 and have saved me quite a bit of
time... there are plenty of tutorials out there for custom ones,
but for $8 its hard to pass up a pre-built... i know this doesnt
answer your question exactly but i figured i would give my 2 cents,
hope this helps :)

Help with buttons in photo gallery

Hello all
I am trying to find a more effeicent way to place buttons on each of my pages (Photo Gallery SIte). I have 150 pages and constantly have to link each button to the "next" or "last" button. Is there a more efficent way to for me to ad butons to each page.My site is Blazinginterest.com
Please give me some feedback on my site, possibly add a picture viewer?
Thank you, HD

what code do you already have? Maybe we can help you modify
it where it's not working.
Also, how do you have it currently laid out? eg. do you have
several images on the screen, but some method to scroll through
other images? Have you done a search here or on director-online.com
(in the forum or articles section) on similar questions? Do you
have something written up to describe what features you need such
as a design document?
Just trying to get a sense of your level of programming in
general, experience with Director and what planning/details you
have worked out so far because there are so many different ways to
program a gallery.

Need help with preloader for photo gallery

Hello!
I know I might be the 99999999991 to say that but I will say
it...I'm a begginer with flash and I have a problem...:-)
I'm building a photo gallery which loads jpg photos inside a
loader component by using MovieClipLoader.
Everything works just great but my only problem is that I
can't scale the content (the jpg's) to the size of the loader
component.
I tryed everything but the photos are loading bigger then the
loader, and I wnat to have the photos bigger then the loader so
that I could have good quality on any resolution. Here's the
actionscript I used, if it's necessary:
//------------------MovieClip Loader---------\\
var mcLoader:MovieClipLoader = new MovieClipLoader ();
var myListener:Object = new Object ();
mcLoader.addListener(myListener)
myListener.onLoadProgress = function
(target_mc,bytesLoaded,bytesTotal) {
extLoader_mc._visible = true;
var pctLoaded = Math.round(bytesLoaded/bytesTotal*100);
extLoader_mc.extLoaderBar_mc._xscale = pctLoaded;
extLoader_mc.extLoadinBarLines_mc._xscale = pctLoaded-1;
extLoader_mc.pct_txt.text = pctLoaded;
if (bytesLoaded >= bytesTotal) {
extLoader_mc._visible = false;
mcLoader.loadClip("pics/zernike1.jpg",picViewer_mc.picLoader);
T
Text
Text

first of all, you can't directly resize the bitmaps, you have to resize the movieclip above it. so if needed, create an empty movieclip inside another wrapper movie clip and resize the wrapper.
then i noticed you don't have onLoadInit in your listener
this method:
myLIstener.onLoadInit=function(mc:MovieClip){
will execute commands after the content is loaded. so you will have to resize your content after it's been loaded. you can't just resize something that you loaded above in your code, you have to wait until it's fully loaded
anyways since you siad you are beginner i will list some useful tip for this job (i don't know if you already know them):
this -refers to current movie clip
this._parent -refers to parent movie cilp
width and height of movie clips are controlled by _width and _height properties, not width height

Need help to create a photo gallery/slideshow

I want to create photo gallery similar to the url below. Is
this an off the shelf or built into flash.
If there's any tutorials that exist please inform. Thanks

Whenever I need a gallery like this i usually just buy one
from:
http://www.flashcomponents.net/component/
they are usually like $8-10 and have saved me quite a bit of
time... there are plenty of tutorials out there for custom ones,
but for $8 its hard to pass up a pre-built... i know this doesnt
answer your question exactly but i figured i would give my 2 cents,
hope this helps :)

Need help with a xml photo gallery

First, hello to everyone. My name is Tudor , i'm from Romania and i have a flash project which implies building an XML driven scrolling photo galery. Very sorry if my english will slip in some phrases. Well , the question for which i must get an answer is: I already built the gallery, everything works ok.... but ... when i want to make some changes when the pictures load .... well here is the problem. I will print the code and briefly explain and ask at the end....
import com.greensock.TweenLite;
import com.greensock.TweenMax;
import fl.transitions.Tween;
import fl.transitions.easing.*;
import fl.transitions.*;
import fl.containers.UILoader;
var MASK_WIDTH:Number = myMask_mc.width;
var menuHolder:MovieClip = new MovieClip();
//menuHolder.x = myMask_mc.x;
//menuHolder.y = myMask_mc.y;
addChild(menuHolder);
var mouseIsOver:Boolean = false;
var oldX:Number = menuHolder.x;
menuHolder.mask = myMask_mc;
import flash.filters.ColorMatrixFilter;
import fl.motion.AdjustColor;
var color : AdjustColor;
var colorMatrix : ColorMatrixFilter;
var matrix : Array;
var filterBW : Array;
color = new AdjustColor();
color.brightness = 20;
color.contrast = 20;
color.hue = 0;
color.saturation = -100;
matrix = color.CalculateFinalFlatArray();
colorMatrix = new ColorMatrixFilter(matrix);
filterBW = [colorMatrix];
/// HERE i read and parse the XML
var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = new XML();
xmlLoader.addEventListener(Event.COMPLETE, LoadXML);
xmlLoader.load(new URLRequest("C:/Documents and Settings/Sm/Desktop/feteModel.xml"));
function LoadXML(e:Event):void
xmlData = new XML(e.target.data);
ParsePictures(xmlData);
function ParsePictures(input:XML):void
var mainPictures:Array = new Array();
var firstPictures:Array = new Array();
var secondPictures:Array = new Array();
var thirdPictures:Array = new Array();
var forthPictures:Array = new Array();
var dimensiuniArray:Array = new Array();
var heightArray:Array = new Array();
var eyeColorArray:Array = new Array();
var hairColorArray:Array = new Array();
var numeArray:Array = new Array();
var mainPicturesList:XMLList = input.fata.pozaPrincipala;
var firstPicturesList:XMLList = input.fata.poza1;
var secondPicturesList:XMLList = input.fata.poza2;
var thirdPicturesList:XMLList = input.fata.poza3;
var forthPicturesList:XMLList = input.fata.poza4;
var dimensiuniList:XMLList = input.fata.dimensiuni;
var heightList:XMLList = input.fata.inaltime;
var eyeColorList:XMLList = input.fata.culoare_ochi;
var hairColorList:XMLList = input.fata.culoare_par;
var numeList:XMLList = input.fata.nume;
for each (var element1:XML in mainPicturesList)
mainPictures.push(element1);
for each (var element2:XML in numeList)
numeArray.push(element2);
   /////////// HERE I LOAD THE PICTURES ...... i must say that menuItem is a mc - exported as a class , which basically has inside a textfield, a UILoader and a preloader - also movieclip. Also i need the pictures to be black and white when they are displayed and when the mouse is over to color
for (var i=0; i < mainPictures.length; i++)
var menuItem:MenuItem;
menuItem = new MenuItem();
menuItem.y = 200;
menuItem.x =(i * (menuItem.width+1))+150;
menuItem.itemLoader.filters = filterBW;
menuItem.itemText.text = numeArray[i];
menuItem.itemLoader.source = mainPictures[i];
menuItem.itemLoader.maintainAspectRatio = false;
menuItem.itemLoader.addEventListener(Event.COMPLETE, completeHandler);
//menuItem.itemLoader.addEventListener(Event.COMPLETE,uiLoaded, false, 0, true);
//menuItem.itemLoader.addEventListener(ProgressEvent.PROGRESS, progressHandler);
//menuItem.itemLoader.load();
//menuItem.preloader_mc.visible = true;
function completeHandler(event:Event)
     //trace(menuItem.itemText.text);
menuItem.mouseChildren = false;
menuItem.buttonMode = true;
menuItem.addEventListener(MouseEvent.MOUSE_OVER, mouseOverItem);
menuItem.addEventListener(MouseEvent.MOUSE_OUT, mouseOutItem);
//Add the menuItem to the menuHolder
menuHolder.addChild(menuItem);
menuHolder.addEventListener(MouseEvent.MOUSE_OVER, mouseOverMenu);
menuHolder.addEventListener(MouseEvent.MOUSE_OUT, mouseOutMenu);
function mouseOverMenu(e:Event):void
mouseIsOver = true;
//Calculate the vertical distance of how far the mouse is from
//the topleft of the mask.
var distance:Number = mouseX - myMask_mc.x;
//Calculate the distance in percentages
var percentage:Number = distance / MASK_WIDTH;
//Save the holder's old y coordinate
oldX = menuHolder.x;
var targetX:Number = -((menuHolder.width - MASK_WIDTH +150) * percentage) + myMask_mc.x;
//Tween the menuHolder to the target coordinate
TweenMax.to(menuHolder, 5, {x: Math.round(targetX)});
//This function is called when the mouse is out of the menu
function mouseOutMenu(e:Event):void
mouseIsOver = false;
var tw1:Tween;
var tw2:Tween;
function mouseOverItem(e:Event):void
var item:MenuItem = e.target as MenuItem;
menuHolder.addChild(item);
item.itemLoader.filters = [];
//trace(item.itemText.text);
tw1 = new Tween(item,"scaleX", Strong.easeInOut,1, 1.25,0.25,true);
tw2 = new Tween(item,"scaleY", Strong.easeInOut,1, 1.25,0.25,true);
//This function is called when mouse moves out of the item
function mouseOutItem(e:Event):void
var item:MenuItem = e.target as MenuItem;
item.itemLoader.filters = filterBW;
tw1 = new Tween(item,"scaleX", Strong.easeInOut,1.25, 1,0.25,true);
tw2 = new Tween(item,"scaleY", Strong.easeInOut,1.25, 1,0.25,true);
Now , i want each picture to scale when it fully loads ... i thought it will be enough to put it on the completeHandler function , but here is the problem - it scales only the last picture ..... eg. if there are 5 , it scales only the 5th ..... i tried to trace the name of the picture inside the completeHandler and also , i got 4 identical names - the name of the last picture ...... my question is : why is the completeHandler firing only for the last item?   anyone has any idea why this is hapening? and more how can i fix it? PLEASE ... i'm burning my brain here for half a day here .......... THANKS in advance!!!!!!!!!!!!!!!!!!
                                                                                                                                                                REGARDS, Tudor

If you are using a "for" loop to do the loading, it can process thru the entire set of loops before the first image is loaded. If you want to have control over the loading you should load things sequencially.
So instead of using a for loop, build a pseudo loop using an array of the files to load, a counter variable, a loading function, and a loadComplete function. Have the loading function load just one image using the counter variable to identify which image in the array to load. Have the loadComplete function process the one image that was just kloaded, increment the counter, and call the loading function if the counter value does not equal the length of the array.

Is it possible to create a Photo Gallery DVD with downloadable content?

I am looking for a way to create a photo gallery, distribute it via DVD, and have the end user be able to download the photos from within the photo gallery. This would function exactly like the iPhoto web galleries, but would be distributed on DVD rather than posted to the web. Is this possible? I am looking for a way for a user to download the photos, in low res and high res, from within the DVD player.

My first suggestion is to use Apple's Pro apps (ie, DVDSP) if you plan to use this DVD commercially. You'll get far better results and you will also be able to meet nearly all of the above objectives.
If on the other hand you don't have the time to learn apple's pro apps which does have a large learning curve compared to the i-apps, and you are currently working with a shoestring budget, then you can meet at least some of these objectives within iDvd by adding your content to the Dvd rom section of the Dvd. The app that one uses to play the slideshow from this data section of the Dvd depends largely on the available apps on the host computer system having access to this data in terms of what software is available to play its content. Hope this makes sense but if not, just come on back. Good luck.
Btw ... I'll check back with you later tonight since I have a fair amount of editing to do this AM.

Is it possible create a photo gallery with java?How do i do?

I must create a photo gallery and I think the best code is java...but I know a little the code.Help me

Check this list:
http://www.java-tips.org/java-applications/photo-album-software/
They are written in Java. They may help..

Can I create a photo gallery with CS4?

I have CS4--Is it outdated, or can I still create a photo gallery to be loaded to a web site with CS4?
Procedure?
I have two galleries that I created with CS4 3 years ago....Is it still possible?
Photoshop---Lightroom--Bridge?

Yes. Use Bridge--output
Creating a web photo gallery | Learn Adobe Bridge CS4 | Adobe TV

Creating flash photo gallery with Bridge

This may not be the best way of creating a flash gallery but
I thought I would try it since I'm new to this and it seems faster
then editing all those photos.
When I create the photo gallery using Adobe Bridge and then
try to open the Flash Movie file to edit the movie it tells me
"Cannot open a protected movie"
Does this mean that I cannot edit the movie after Bridge
creates it or is there a way around this?

Welcome Alex -
Any picture you display on your site can be saved to the visitor's computer.
If you ZIP each gallery, a simple link to the zipped archive will offer the visitor
an option to save to their computer.

Is it possible to creat a Photo Gallery on CD/DVD with downloadable content

I am looking for a way to create a photo gallery, distribute it via CD or DVD, and have the end user be able to download the photos in the gallery from within the photo gallery. This would function exactly like the iPhoto web galleries, but would be distributed on CD/DVD rather than posted to the web. Is this possible? I am looking for a way for a user to download the photos, in low res and high res, from within a gallery browser.

It is not a matter of my wanting to overcomplicate things. It is a client request. They want to be able to send out photos of their products on CD/DVD, have the images pop up in a nice looking preview (slideshow) and allow the user to have the ability to download the photos, low res or high res, to their desktop from within the preview (slideshow).
This is a quite common approach for equipment manufacturers who are trying to simplify the process for their end users.

How can I create a photo gallery in flash cs3, Iam a beginner in flash

How can I create a photo gallery to put into my current flash site Iam creating? Using flash cs3, can anybody suggest any tutorials (noting complicated with me being new to flash cs3)
When going on line I saw that maybe you can use Dreamweaver, XML, or even Photoshop can anybody explain the difference between using one or the other?
THanks

Indeed, google ftw.
For example:
+as3 photo gallery flash tutorial
reveals many including this one:
http://www.flashmagazine.com/Tutorials/detail/as3_photo_gallery/

Creating a photo gallery like the China Gallery in Adobe Labs. How?

I have photos in several categories (I'll use 2, "frank" and "wolfie" as examples here). What I'd like to do is build a photo gallery like the China Photo Gallery shown in the Adobe Labs site, where the user can switch between categories without going to a different page. Here's what I've done so far and how I'm stuck:
I created a photo gallery with the instructions in the tutorial "Building a photo album with the Spry Framwork". I then inserted a Tabbed Panels widget for navigating between the categories.
I set up an XML file as follows:
/* frank category */
<photo
path = "001p.png"
width = "467"
height = "467"
thumbpath = "001p.png"
thumbwidth = "85"
thumbheight = "85">
</photo>
/* wolfie category */
<photo
path = "001f.png"
width = "467"
height = "467"
thumbpath = "001f.png"
thumbwidth = "85"
thumbheight = "85">
</photo>
To create the div holding the thumbnails for the "frank" category, I entered the following:
<div class="thumbdiv" spry:region="dsGallery"><img src="thumbnails/frank/{@thumbpath}" spry:repeat="dsGallery" spry:setrow="dsGallery" class="thumbs" /></div>
To create the div where the full size images will be displayed, I entered the following:
<div class="mainpic" spry:detailregion="dsGallery"><img src="images/frank/{@path}" onload="MM_effectAppearFade(this, 1500, 0, 100, false)" /></div>
Then, in the tabbed panel set for the "wolfie" category, I did the same thing, substituting "wolfie" for "frank". However, since there is only one xml file, spaceholders for all of the thumbnails appear in the thumbnail div for the frank category. I realize that I'll probably need to create a separate xml file for each category, but how do I set it up so the correct xml file is accessed when the link in the tab is clicked? Or am I approaching this all wrong?
From reviewing the source for the China gallery, it appears that they set up links to different xml files instead of Tabbed Panels. How does that work? There are also some javascript files I can't find anywhere on Adobe's site.
Thanks

Hi,
If you have seperate XML file but with the same basic structure then you can change the XML a Spry dataset refers to and regenerate the spry region without reloading the full page.
So on my photo gallery page I can change the album the photos are shown from via the seturl sprydata function as below. dsPhotos being my Spry dataset that points to the relevant XML dataset with my image references and captions etc. My XML is actually dynamically generated from Picasa RSS feeds (and RSS feeds are XML) but the principle will be the same with your static XML.
First I add an event listener for when someone clicks on an album (the li tag within my div with the id "albums" holds a photo and title for each album.)
function Albums()
var myalbums = Spry.$$("#albums li", "TabbedPanels1")
var rows = dsAlbums.getData();
var setListener = function( element, value )
Spry.Utils.addEventListener( element, "click", function(){ showAlbum( value ); },false );
for( var i = 0, length = myalbums.length; i < length; i++ )
setListener( myalbums[i], i );
Then this is the code which changes the photo album to be shown. (when the user clicks the relevant album)
function showAlbum(i)
pauseShow();
pImage = 'No';
var rows = dsAlbums.getData();
var albumid = rows[i]["albumid"];
var url = "xml/PicasaAphotoFeed.asp?albumid=" + albumid;
dsPhotos.setURL(url);
dsPhotos.loadData();
var rowcount = dsAlbums.getRowCount() - 1;
var nextalbum;
var navnext;
var n;
The page is here www.thehmc.co.uk/photo5.html is you want to see it in context.
In your case showAlbum would switch between Frank.xml or Wolfie.xml depending on how you decide to name your xml datasets.
Regards
Phil

What is the best way to create a photo gallery?

Hi,
I want to create a photo gallery in Dreamweaver without using any pre-built "web gallery" function. What's the best way to swap the images when I click the "next" button? Do I create a new Dreamweaver page for each photograph? Is there a more efficient way to do it than that?
Thanks,
Gordon

Is there a more efficient way to do it than that?
Most definitely. With scripts.
57+ Free Galleries, Slideshows & Lightbox solutions:
http://www.1stwebdesigner.com/css/57-free-image-gallery-slideshow-and-lightbox-solutions/
20 Best jQuery Slideshow Scripts
http://graphicalerts.com/20-best-jquery-slideshow-image-photo-gallery-plugins/
If you're a photographer or managing a large collection of images, look at JAlbum.
Download the software. Drag & Drop your images/folder of images into the work space. Hit create album. In a few seconds, jAlbum generates your HTML pages and thumbnail images for you. A real time saver with plenty of customizable skins to choose from.
Download: http://jalbum.net/software;jsessionid=qkhdjzieqjtg1rz4x2anjlk5d
Skins: http://jalbum.net/skins
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb

CS6 How to create a photo gallery?

CS6 How to create a photo Gallery?

I like Fancybox2. It's a big improvement over Lightbox & the original Fancybox.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5, with Fancybox2 Viewer</title>


<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<link href="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.css" rel="stylesheet" media="screen">
<script src="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.4/jquery.fancybox.pack.js"></script>
<style>
/**this styles image container**/
#thumbs p {
    float: left;
    width: 180px;
    height: 12.5em;
    margin: 10px 0 0 20px;
    padding: 10px;
    border: 1px solid silver;
    /**rounded borders**/
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    /**this styles caption text**/
    font: italic 14px/1.5 Geneva, Arial, Helvetica, sans-serif;
    color: #666;
    text-align: center;
/**recommend using same size images**/
#thumbs img {
    width: 160px; /**adjust width to thumbnail**/
    height: 120px; /**adjust height to thumbnail**/
    margin-bottom: 1.5em;
    opacity: 0.75;
#thumbs img:hover { opacity: 1.0 }
/**float clearing**/
#thumbs:after {
    content: ".";
    clear: left;
    font-size: 0px;
    line-height: 0;
    display: block;
    visibility: hidden;
</style>
</head>
<body>
<h1><a href="http://fancyapps.com/fancybox/">Fancybox2</a> Viewer with images</h1>

<div id="thumbs"> <p><a class="fancybox" data-fancybox-group="gallery" href="http://placehold.it/400x320.jpg" title="optional captions"><img src="http://placehold.it/160x120.jpg" alt="Thumbnail 1" /></a> <br />
Caption 1 </p>
<p><a class="fancybox" data-fancybox-group="gallery" href="http://placehold.it/400x320.jpg" title="optional captions"><img src="http://placehold.it/160x120.jpg" alt="Thumbnail 2" /></a> <br />
Caption 2 </p>
<p><a class="fancybox" data-fancybox-group="gallery" href="http://placehold.it/400x320.jpg" title="optional captions"><img src="http://placehold.it/160x120.jpg" alt="Thumbnail 3" /></a> <br />
Caption 3 </p>
<p><a class="fancybox" data-fancybox-group="gallery" href="http://placehold.it/400x320.jpg" title="optional captions"><img src="http://placehold.it/160x120.jpg" alt="Thumbnail 4" /></a> <br />
Caption 4 </p>
<p><a class="fancybox" data-fancybox-group="gallery" href="http://placehold.it/400x320.jpg" title="optional captions"><img src="http://placehold.it/160x120" alt="Thumbnail 5" /></a> <br />
Caption 5 </p>
</div>

<h1>Fancybox with Iframe</h1>
<h3><a class="fancybox" data-fancybox-type="iframe" href="http://example.com">EXAMPLE.COM</a></h3>

<script>
$(document).ready(function() {
    $('.fancybox, iframe').fancybox();
</script>
</body>
</html>
Nancy O.

Help with creating a photo gallery?

Similar Messages

Maybe you are looking for