Neet to make an as3 scrolling thumbnail gallery

Hey , i need some suggestion and tips on how to do and what to search for to accomplish what i need. Here's what i want to make:
have 30 photos and 50 , so 2 gallery's . - make thumbnails small for the pics inside a MC with saturaion -90 and it should be with mosue control .. when i rollOver a pic the saturation changes to 0 and when i rollOver Left side and Right side to MC ,the pics to go right or left depending where the mouse is. When i RollOut mouse, th animation to move on either side with a slow speed. and when i clik on a thumbnail pic i need it to enlarge and center align or left align ; and i want to have be able to wirte some text besides the photo. and a X butn to close the image and resume the animation.! Bassically thats what i need to make; a more complex thing i want is that when i enlrge any pic , i want to appear on a side the text + another gallery image with thimbanils and a scrollbar and when clicked on them to enlarge.
My project is that : i have Event Flyers and when click on each eventFlyer i need to enlarge that flyer and to have another galerry with images from that respective event. I need to make that for every flyer
i hope u understand and please give me any suggestin on how to do that, any tip , what kind of code to search for to achieve that. I have to do it on my own i dont want to buy a galerry template .
I'm not very good at AS, but i want to learn and search to do it.
Only AS3 i need, i prefer not a very complicated option for what i want, but if isnt a simpler way , for the beginners, its alright a complex work too, just have to study more.
What i'm thinking is 2 find out what code ,process, steps i need to do for my gallery so i can search,find,learn and put together to accomplish my gallery; pls point me in a good direction!
Thanks alot!

If you want to do it on your own, and find it on your own, then use Google as search with terms relevant to your needs. Generally, you should include "AS3" and "tutorial" as part of your search keywords. Beyond those two, include terms that are directly relevant to what you want to find.
Try something like "AS3 gallery tutorial" for starters and refine it if you don't find something relevant to your needs. Be aware that anything you find is not likely to be exactly what you want, so you will need to gain enough knowledge as a Flash developer to be able to understand how to manipulate what you find into what you need.

Similar Messages

Spacing a scrolling thumbnail gallery

Hiya,
OK...easiest thing is for you to take a look at this
CLICK FOR SAMPLE
Click on photo...click to view portfolio...click landscapes
and you'll get an idea of what i'm trying to achieve.
The idea is that when you roll over the images they grow to
give a larger view. Each thumbnail is a movie with action script to
make it expand on rollover and shrink on rollout.
As you can see, when the images expand they overlap the
thumbnails and appear under the thumbnails on the right...doesnt
look too impressive. Obviously the effect i wish to achieve is that
the thumbnails spread either side of the enlarged image. Is there
any coding I can sue to achieve this?
Alternatively (and possibly in preference to this) is it
possible to create the effect of a mac dock - i.e. the images
gradually get smaller away from the cursor -
SEE
THIS IMAGE. I'm guessing I would need to define an objects size
depending upon how close to its centre the cursor is.
Can anyone help me out?
Thanks very much!
Alex

Hello aniebel,
i am trying to create the same sort of panel scroll but am
having trouble having the panel sroll from left to right when mouse
is over. here is what i have so far:
panel.onRollOver = panelOver;
function panelOver() {
this.onEnterFrame = scrollPanel;
delete this.onRollOver;
var b = stroke.getBounds(_root)
function scrollPanel () {
if(_xmouse<b.xMin || _xmouse>b.Max ||
_ymouse<b.yMin || _ymouse>b.yMax);
this.onRollOver = panelOver;
delete this.onEnterFrame
if(panel._x >= -348.2) {
panel._x = -348.2;
if(panel._x >=-839.5) {
panel._x = -839.5;
var xdist = _xmouse -383;
panel._x += -xdist / 7;{
does this make sense??? or am i just confusing things??
thanks in advance.

Scrolling thumbnail gallery

Hello. I am trying to create a gallery that has one large image on top and a horizontal strip of thumbnails on the bottom of the layout. I need the thumbnails to be able to scroll and be a button to change the large image on top. This is for an interactive pdf for my iPad. When I import the folio onto my iPad the thumbnails scroll but do not act like buttons to change out the large image. Any help would be extremely appreciated. Thank you.

Yeah I'll walk through my process real quick. I made 12 picture boxes that spread out past the page size. I inserted different jpgs into each one. I copied those to the top of the layout, aligned them horizontal and vertical, then resized them to fill most of the page. Those stack of large images I then turned into an MSO. Next I turned each thumbail into a button and assigned them to the proper state. Then I created a picture box where I want the thumbnails to be seen. I grouped the thumbnails, cut them, then did "paste into" into the picture box. The thumbnails still show the button icon on them in ID. When I upload the folio and open it on my iPad the thumbnails scroll but the thumbnails do not function as buttons for the MSO. Thanks for your help.

Scrolling XML Gallery

Howdy,
I would like to create an sliding xml drivin photo gallery,
similar to
this
one at flashkit but all linear and only previous and next
buttons, no numbers. Any ideas?
Thanks,
Conrad

Hi --
I clicked on the link for your gallery and the images load??
Both when I
click on the image or when I click the "next" and "previous"
buttons --
although the "hit" area for the buttons is below the actual
text so you
should adjust that on those buttons. I would also recommend
not making the
text selectable so the cursor won't change to the "I bar"
Rich
"joesavy" <[email protected]> wrote in
message
news:fcp3qi$4ak$[email protected]..
>I created an XML scrolling thumbnail gallery using a
>
http://www.kirupa.com/developer/mx2004/thumbnails.htm
>
> I then had to alter the action script to get my
thumbnails to display
> properly
> -- they were spaced out or overlapping each other and
not in the sequence
> specified in the XML file. The new code works great
locally, but the
> thumbnails
> and larger image refuse to load remotely in every
browser i've tried. Any
> thoughts on how to alter the action script to load the
gallery?!?! I'm not
> much
> experienced in Flash so any help would be most
appreciated.
>
> You can find the page with my unloadable gallery
>
http://www.sullivancreative.com/clients/se-07-7-24/se_website/gallery.html
>
> You can see my action script in my
>
http://www.sullivancreative.com/clients/se-07-7-24/se_website/xml_photogallery_s
> crollthms_fix.fla
>
> Thanks!
> Joe.
>
>

AS3 Creating Side Scrolling Thumbnails?

I'm creating a gallery page for my site, and I need a side
scrolling thumbnail display.
Basically it would have several thumbnails that would keep
scrolling for ever (some how duplicating the content in a mask). If
anyone has anything like this or any links that would be great.
Cheers!
Parallels.fm

Six different examples here:
http://robdillon.com/flash.html

Scrolling thumbnails panel AS3 tutorial

I am working on making a thumbnail gallery, but first I want
to get a great thumbnail gallery going.
Are there any good sites on this that have AS3 that I can
check out???
yours sincerely

Six different examples here:
http://robdillon.com/flash.html

How to make a thumbnail gallery page that'll open individual slideshows?

Hi,
I'm trying to make a gallery of thumbnails for album covers I did, and want for it to open its own slideshow (on the same page / as a typical slideshow pop up) when a person clicks on one so he/she can view the main image and a few more thumbnails on its side for other artwork panels (as well as use the arrows if possible).
Anyone got an idea for an easier way to do this?
Thanks! I'm going insane over this... And it seems like this could be the easiest thing, but somehow I can't find a way...
(idem for B and C and so forth)
=

Hi,
That would seem to be the perfect logical answer. But guess what? I've tried this many times without any luck. I MUST be doing something wrong, but simply have no clue what it is. SO I'll describe every tiny step, and maybe you can see where I'm at fault.
1- I drag & drop a Lightbox display from the the composition folder in the Widget library on a blank page.
2- I delete 2 of the 3 default thumbnails from above the main target/container,
3- I select the remaining whitest thumbnail, go on the FILL option the left corner, and add an image from my files. I choose scale to fit and make it the size I want.
4- I open the Trigger option in the upper left area and do the same for the "Normal" state (as a default, Muse puts it on the "Active" one). Now all my states have the same image. I also remove the stroke and fill color behind.
4- I select the default gray bars with arrows within the CONTAINER below and remove them (simply because I intend to change them with my own design and to make sure I don't stumble on them for the forthcoming steps)
5- I select the TARGET area and then go to my FILL option and change the white area to "no color".
6- I then select the CONTAINER area and change the default back color to an image of my choice (a background that I put at 80% transparency).
7- I re-select the TARGET area and drop a Lightbox widget from the Slideshows folder in the Widget library into the selected TARGET area. I resize it to my liking.
8- I go and click on the upper right option button (white arrow under a blue circle) of this new Lightbox to add the images I want.
9- As predicted, the images appear as they should: One big in the center and the proper amount of thumbnails above. When I click on them, they appear sequentially below also as intented.
10- At this point all should be great and working (I think), so I go in the preview section (and also tried via the Preview in Browser (crtl+shift+e)) and what appears, is my page with the actual thumbnail of the cover (again, as it should). BUT here comes the bug::::
Once I click on it, the Lightbox slideshow pops up, and all shows up but the actual center main image (as well as its default black area behind the image), e.g. what should be the bigger version of the 1rst thumbnail from the series above it. I try to click on the other thumbnails above the invisible image and nothing happens. Actually something does happen, because if I decide to click outside of the of the main image area, ONLY then all fades again and my main image pops up ALONE, everything else fades away! So to get out of there, I have to reclick outside but I'm then pushed back to the main original thumbnail gallery....
So it feels like it sorts of become like a 3rd level thing and this is obviously not what is needed...
Any idea what's problematic?!
Much thanks for having taken the time to read my little novel here! ; )
If this is not quite clear still, I could post a video of all of what I'm doing and the resulting problem.

Make 3D Flash wedding photo gallery with songs

Last week, my dearest sister got married. There were about a gazillion things to love about her wedding day… so many moments all wrapped up into one very totally unforgotten event. I took lots of wedding photos on her wedding day and wanted to give her a surprise of making her a 3D flash wedding photo gallery with wedding songs.
As I expected, my sister was moved, many thanks she said to me. Now I just want to give my many thanks to Aneesoft 3D Flash Gallery. It is a wedding gallery making software that helped me make so gorgeous flash gallery with my sister's wedding pictures. Knowing nothing about flash making, I never thought making a splendid 3D flash gallery would be so easy. My friend, do you eager to make your own cool, awesome flash gallery now? Do you eager to sharing your wedding photos in a stunning 3D photo gallery? Let me show you the way!
What you'll need:
1. Wedding photos and wedding songs for your 3D flash gallery
2. Aneesoft 3D Flash Gallery
Step 1: Download & install Aneesoft 3D Flash Gallery
We'll be using a very nice 3D gallery making software 'Aneesoft 3D Flash Gallery' to making a romantic wedding flash gallery with wedding photos and wedding songs, head over here and download the free trial version. Next step is to install the program.
Step 2: Import wedding photos and edit
You can add up to 500 photos that you want to use in your wedding photo gallery, arrange the photos as you like. Aneesoft 3D Flash Gallery supports a wide range of file formats for images, such as .jpg, .bmp, .gif. Click "Add Caption" to add title and description for your wedding photos. And you can also crop and add special effects to them to make your wedding photos more perfect
Step 3: Choose from a variety of wedding flash gallery templates
Aneesoft 3D Flash Gallery offer you an easy way to make a stunning wedding photo gallery by choosing from variety of flash gallery templates. A flash gallery template automatically put preset decoration to wedding gallery. When you select a preset flash gallery template, you're able to enhance it by customizing some additional settings, such as background, thumbnail effects, playback options and scrolling actions. For the adventurous users, explore the powerful advanced features and tools that gives you total control over how you compose your wedding flash photo gallery.
Step 4: Add some wedding songs for your wedding flash gallery
Wedding songs are a very important factor to consider when making your wedding flash photo gallery. They set the general mood and tone for your gallery, while also allowing you to express your feelings through music. You may find the perfect wedding songs out of hundreds of popular wedding songs and music through Amazon.com or iTunes.
In this step, you can add some wedding songs as background music to play along with your wedding flash gallery. Click Add Music button to browse and add your wedding songs. You can add, remove and edit the wedding music files. And you may check the option to control the background music looping or not.
Step 5: Preview and publish your 3D wedding flash gallery
It is advisable that you preview the wedding flash gallery at least once, before you publish it. Click and drag mouse for scrolling and tilting the 3D flash gallery. Click on the thumbnail to zoom in and out the photos. You have several options to share and publish your 3D wedding photo gallery, such as SWF, EXE and HTML. It depends on your needs.
OK, now your wedding flash gallery is done. What do you think of the wedding flash gallery that I made for my sister? End with my sister's sentences "Fun is not ending, romantic is not ending, and love is just beginning!" Wish your wedding pictures can also be splendid as my sister's, and your love is just beginning, enjoy!
know more:
http://www.aneesoft.com/win-3d-flash-gallery.html
http://www.aneesoft.com/tutorials/3d-flash-gallery/make-wedding-flash-gallery-with-songs.h tml

As for AS3 part of it, I am not sure your code really works. There are syntax and logical errors there.
I think you need to take it step by step and accomplish several task in the following sequences:
1. Write code that loads XML correctly;
2. Write code that enables buttons;
3. Write code that will load images on button clicks.
The code below shows in principal what needs to be done in order to load XML and make the data in this XML available for further consumption. Also, by accomplishing this step you will iron out all the PHP vs Flash wrinkles including your XML.
Please note, I don't know your XML structure so all the parsing issues you need to resolve yourself.
Once you get handle on it - we, hopefully, will talk about steps 2 and 3.
import flash.display.Loader;
import flash.events.*;
import flash.net.*;
var images:XML;
var myRequest:URLRequest;
var myLoader:URLLoader;
// list of image urls that will come from loaded XML
var imageList:XMLList;
myRequest = new URLRequest("Photography.php");
myLoader = new URLLoader();
myLoader.addEventListener(Event.COMPLETE, onFileLoaded);
// suggested handler for unexpected errors - avoids some headaches
myLoader.addEventListener(IOErrorEvent.IO_ERROR, onLoadError);
myLoader.load(myRequest);
// Note: all the listeners are removed
// it is always wise to remove listeners that are needed any longer
// to make objects eligible for arbage collection
function onLoadError(e:IOErrorEvent):void
     trace(e.toString());
     myLoader.removeEventListener(Event.COMPLETE, onFileLoaded);
     myLoader.removeEventListener(IOErrorEvent.IO_ERROR, onLoadError);
function onFileLoaded(e:Event):void
     myLoader.removeEventListener(Event.COMPLETE, onFileLoaded);
     myLoader.removeEventListener(IOErrorEvent.IO_ERROR, onLoadError);
     images = new XML(myLoader.data);
     // only now xml is ready and you can start loading images
     imageList= images.pic;

Tutorial on creating a scrolling thumbnail menu in AS 3.0

I've found several good tutorials in AS2.0 on creating a scrolling thumbnail menu bar for adding to a photo gallery, but nothing in AS3.0. Anyone have a tutorial or code they'd like to share?

A solution using tilelist component
import fl.controls.TileList;
    import fl.controls.listClasses.ImageCell;
    import fl.data.DataProvider;
    import fl.events.ListEvent;
    import flash.display.Sprite;
    import flash.events.Event;
    import flash.display.Loader;
    import flash.net.URLRequest;
var loader:Loader;
var dp:DataProvider = new DataProvider();
dp.addItem({label:"IMAGE 1",source:"images/image1.jpg"});
dp.addItem({label:"IMAGE 2",source:"images/image2.jpg"});
dp.addItem({label:"IMAGE 3",source:"images/image3.jpg"});
dp.addItem({label:"IMAGE 4",source:"images/image4.jpg"});
dp.addItem({label:"IMAGE 1",source:"images/image1.jpg"});
dp.addItem({label:"IMAGE 2",source:"images/image2.jpg"});
dp.addItem({label:"IMAGE 3",source:"images/image3.jpg"});
dp.addItem({label:"IMAGE 4",source:"images/image4.jpg"});
dp.addItem({label:"IMAGE 1",source:"images/image1.jpg"});
dp.addItem({label:"IMAGE 2",source:"images/image2.jpg"});
dp.addItem({label:"IMAGE 3",source:"images/image3.jpg"});
dp.addItem({label:"IMAGE 4",source:"images/image4.jpg"});
tilewindow.width=500;
tilewindow.height=100;
tilewindow.dataProvider = dp;
tilewindow.rowCount=1;
tilewindow.addEventListener(ListEvent.ITEM_CLICK,loadImage);
function loadImage(event):void{
loader = new Loader();
loader.contentLoaderInfo.addEventListener(Event.COMPLETE,oncom);
loader.addEventListener(IOErrorEvent.IO_ERROR,onerr);
loader.load(new URLRequest(event.item.source));
function oncom(event):void{
container.addChild(loader.content);
loader.content.width=500;
loader.content.height=250;
function onerr(event):void{
trace(event);
complete source can be found here http://www.4shared.com/file/zeOd0Dey/tileListcomponent.html

XML scrolling thumbnail, image loader, & Buttons [halfway works]

Intro:
I started a flash-based website a few years ago. Back in 2006 I was able to get a xml scrolling thumbnail, image loader to work without a glitch.
For numerous reasons I had to put the project on hold until now. [one was that my 30 day trial of flash expired and only recently was I able to purchase the Adobe Web Suite CS4 as well as a new computer which could run the apps.]
Last Friday saw a bump in the road in the development of my site as two, rather straightforward task, turned into something short of a nightmare as I have been unable to get past these two, seemingly, relatively simple task.
I have posted in 4 other flash forums the issues, in detail, that I am facing - and have quite a bit of interest/views in the topic as the numbers suggest - yet no response/answer as of yet. [Which confirms other messages I have seen which seem to state that working with buttons has become increasingly difficult with the newer version of flash - something Im a bit surprised with actually from Adobe. - I would have thought there would be a palette where you could set parameters...]
Screenshot of Site/Timeline:
Before getting into the two questions I have, I would like to post an image of the site as it looks whenever an swf file is saved out, as well as a piece of the timeline in the back for reference.
Issue #1
As of now when the swf file is saved out you get exactly what you see above:
a: A scrolling thumbnail
b: ...which loads a large image when clicked on it - PEFECT...
BUT...
1a: I need for the buttons to load in this action, not for it to just load on its own.
[i.e., the silk_paintings gallery is what is open, so I need the "silk_paintings" button to call up this action]
note: Initially I had attacked this problem by taking out the actions layer you see above and applying it directly to the individual buttons with some crude MouseEvent Listener/Handerls... that did not work - at all.
Im sure it may be "easier" to make an array out of it, but with my coding level it may be "easier" to apply it to the buttons.
1b: How I currently see it, I would take the xml-list and duplicate it for the number of galleries I have.
[I would then re-name the xml-list to reflect the name of the galleries they are to represent, i.e. "silk_paintings"]
[also, I would have to rename the folders to "thumbnails1,2,3, etc., & "images 1,2,3, etc"
From there I would duplicate the actions and paste it into the buttons, changing the xml-list name to that of "silk_paintings", etc., as well as write in the MouseEvent listener Handler to make it work. [ah, ha, but what is that magic phrase, I have tried to implement various code from other tutorials, and all in vein.]
Issue #2
At this point I would be tickled pink just to get this to basic function to work.
However, once the buttons are working and calling up the xml, etc., then I need the buttons to stay on the semi-transparent blue color it is whenever in the 'hit' state. [note: NOT pictured above.]
With the way the buttons are currently set up, and with wanting to use scripting to get them to interact with the thumbnail gallery, it will have to be some miraculous code to tell that button what color to stay as whenever its clicked, and of course it going back to white when another button is clicked.
Conclusion:
Since this is an Adobe Forum I would like to make a few additional statements in hopes that the developers, etc. may take heed.
Adobes products are not cheap, and when I went to purchase the websuite I went in as a designer needing a program as not to need to program.
I understand the flexibility that coding gives, but something as simple as linking buttons should not be in the realms of rocket science. [yes, for many its not...but my brain just does not operate that route despite all the tutorials thrown at me.]
Again, it would seem that there would be a button panel where you could drag options like scrolling thumbnail slider, loader, and then parameters would come up. [much like Apples iWeb. - but before the argument of one being pro and the other for non-pros, I see it differently. Software should not be the limiting factor in how flexible you can design, or rather ones lack of programming shouldnt be. With all the talented, and I say this in all humility and honesty, programmers working for Adobe, Im sure something could be programmed like what Im asking for.]
note: Director is a good example, back in 1997 I knew nothing of multimedia and in one week I had assembled a portfolio, clicking buttons, speech, movies, and all. - and no, I dont have the money to buy more software!
At this moment I am at the mercy of someone who reads code like its a nighttime tale they are telling their kids, and who can see the exact issue I have and can share the appropriate, correct code. [as I have noticed, it has to be on target - naturally - but this target changes with just a slight change in the design.]
Thank you,
peace
Dalen
p.s.
The actionscript: [note: This is only the current working/good code that Im trying to get the buttons to call up.]
stop();
fscommand("allowscale", false);//keep SWF display at 100%
var x:XML = new XML ();//Define XML Object
x.ignoreWhite = true;
var fullURL:Array = new Array;//Array of full size image urls
var thumbURL:Array = new Array;//Array of thumbnail urls
var thumbX:Number = 25;//Initial offset of _x for first thumbnail
x.onLoad = function(){ //Function runs after XML is loaded
    var photos:Array = this.firstChild.childNodes;//Defines variable for length of XML file
     for (i=0;i<photos.length;i++) {//For loop to step through all entry lines of XML file
          fullURL.push(photos[i].attributes.urls);//Each loop, adds URL for full sized image to Array fullURL
          thumbURL.push(photos[i].attributes.thumbs);//Each loop, adds URL for thumbnails to Array thumbURL
          trace(i+". Full Image = "+fullURL[i]+" Thumb Image = "+thumbURL[i]);
          var t = panel.attachMovie("b","b"+i,i);//Each loop, Define local variable 't' as a new instance of 'b' movie clip, given unique instance name of 'b' plus the index number of the For loop
          t.img.loadMovie(thumbURL[i]);// Each loop, load thumbnail image from XML data into variable movie clip
          t._y = 0;//Set Y coordinate of variable movie clip
          t._x = thumbX;//Set X coordinate of variable movie clip based on variable thumbX
          t.numb = i;//Set sub-variable 'numb' inside variable t to hold index number
          t._alpha = 75;//Set the Alpha value of the variable movie clip to 75% - for onRollOver highlight action
          thumbX += 55;//Increment thumbX value so next thumbnail is placed 125 pixels to the right of the one before
          t.onRollOver = function () {//define onRollOver event of the variable movie clip
               this._alpha = 100;//Set thumbnail alpha to 100% for highlight
          t.onRollOut = function () {//define onRollOut event of the variable movie clip
               this._alpha = 75;//Reset thumbnail alpha to 75%
          t.onPress = function () {//define onPress event of the variable movie clip
               this._rotation += 3;//rotates thumbnail 3 degrees to indicate it's been pressed
               this._x += 3;//Offset X coordinate by 3 pixels to keep clip centered during rotation
               this._y -= 3;//Offset Y coordinate by 3 pixels to keep clip centered during rotation
          t.onReleaseOutside = function () {//define onRelease event of the variable movie clip
               this._rotation -= 3;//rotate thumbnail back 3 degrees
               this._x -= 3;//Reset X coordinate by 3 pixels to keep clip centered during rotation
               this._y += 3;//Reset Y coordinate by 3 pixels to keep clip centered during rotation
               this._alpha = 75;//Reset thumbnail alpha to 75%
          t.onRelease = function () {//define onRelease function to load full sized image
               this._rotation -= 3;//rotate thumbnail back 3 degrees
               this._x -= 3;//Reset X coordinate by 3 pixels to keep clip centered during
               this._y += 3;//Reset Y coordinate by 3 pixels to keep clip centered during
               this._alpha = 75;//Reset thumbnail alpha to 75%
               holder.loadMovie(fullURL[this.numb]);//Load full sized image into holder clip based on sub-variable t.numb, referenced by 'this'
     holder.loadMovie(fullURL[0]);//Initially load first full size image into holder clip
x.load ("silk_paintings.xml");// path to XML file
panel.onRollOver = panelOver;
function panelOver() {
     this.onEnterFrame = scrollPanel;
     delete this.onRollOver;
var b = stroke.getBounds(_root);
function scrollPanel() {
     if (_xmouse<b.xMin||_xmouse>b.xMax||_ymouse<b.yMin||_ymouse>b.yMax) {
     this.onRollOver = panelOver;
     delete this.onEnterFrame;
     if (panel._x >= 740) {
     panel._x = 740;
if(panel._x <= (thumbX-10)) {
          panel._x = (thumbX-10)
     var xdist = _xmouse - 830;
     panel._x += -xdist / 7;
The xml:
<?xml version="1.0" encoding="ISO-8859-1"?>
<slideshow>
<photo thumbs="thumbnails/i_brown_fairy.jpg" urls="images/brown_fairy.jpg" />
<photo thumbs="thumbnails/i_blonde_fairy.jpg" urls="images/blonde_fairy.jpg" />
<photo thumbs="thumbnails/i_flower_fairy.jpg" urls="images/flower_fairy.jpg" />
<photo thumbs="thumbnails/i_red_fairy.jpg" urls="images/red-fairy.jpg" />
</slideshow>
Attached is a link to the file I made named "index".
https://rcpt.yousendit.com/706233226/5e7b4fe0973dacf090b5cbae32c47398
I would have liked to have included the following files but was limited due to "you-send-it" not uploading folders. Files not included: [but functioning] : xml list - images [folder] - thumbnails [folder]
Again, Thank you
Dalen

The issues with the buttons calling up the scrolling thumbnail panel have been resolved, as well as keeping the buttons in their hit state once clicked, thanks to Rob.
Those that have been following this thread, or stumble upon it in their searches later, may appreciate to see the final solution to this particular issue.
[Hopefully I will be able to update this thread with a url in the future to show the site in operation, which may help somebody with their project in the future if its set up similarly.]
Alas, it would be nice if future versions of flash had a more direct, flexible, user friendly method for creating navigation.
[We may see development beyond the flash ads which everyone seems to loathe... and more creativity with flash in terms of games, web interactivity, & animation.
Below are 2 sets of code:
a] the first is located within the first frame of the first button, and has some extra variables in it that the additional buttons call upon...
b] the second is the code applied to every other button.
stop();
fscommand("allowscale", false);//keep SWF display at 100%
var x:XML = new XML();//Define XML Object
x.ignoreWhite = true;
var fullURL:Array = new Array();//Array of full size image urls
var thumbURL:Array = new Array();//Array of thumbnail urls
// ....... CHANGE
var thumbX:Number;// = 25;//Initial offset of _x for first thumbnail
// make an array of all of the instance names of each button object...
// only do this once
var buttonsList:Array = new Array(shadesOfGrey, silkPaintings);
shadesOfGrey.isLatched = false;
// the rollover function... repeat for each button
shadesOfGrey.onRollOver = shadesOfGrey.onDragOver=function ():Void {
     if (!this.isLatched) {
          this.gotoAndStop(2);
// the rolloff function... repeat for each button
shadesOfGrey.onRollOut = shadesOfGrey.onDragOut=shadesOfGrey.onReleaseOutside=function ():Void {
     if (!this.isLatched) {
          this.gotoAndStop(1);
// the mouse press function... repeat for each button
shadesOfGrey.onPress = function():Void {
     resetAllButtons();
     this.isLatched = true;
     this.gotoAndStop(3);
shadesOfGrey.onRelease = function():Void {
     x.load("shadesOfGrey.xml");// path to XML file
     thumbX = 25;
function resetAllButtons():Void {
     for (b in buttonsList) {
          buttonsList[b].isLatched = false;
          buttonsList[b].gotoAndStop(1);
x.onLoad = function() {//Function runs after XML is loaded
     // resets the position of the panel on each new load
     panel._x = 740;
     // ....... CHANGE removes the existing movieclips from the panel before any new load...
     for (c in panel) {
          if (typeof (panel[c]) == "movieclip") {
               removeMovieClip(panel[c]);
     var photos:Array = this.firstChild.childNodes;//Defines variable for length of XML file
     for (i=0; i<photos.length; i++) {//For loop to step through all entry lines of XML file
          fullURL.push(photos[i].attributes.urls);//Each loop, adds URL for full sized image to Array fullURL
          thumbURL.push(photos[i].attributes.thumbs);//Each loop, adds URL for thumbnails to Array thumbURL
          //trace(i+". Full Image = "+fullURL[i]+" Thumb Image = "+thumbURL[i]);
          var t = panel.attachMovie("b", "b"+i, i);//Each loop, Define local variable 't' as a new instance of 'b' movie clip, given unique instance name of 'b' plus the index number of the For loop
          t.img.loadMovie(thumbURL[i]);// Each loop, load thumbnail image from XML data into variable movie clip
          t._y = 0;//Set Y coordinate of variable movie clip
          t._x = thumbX;//Set X coordinate of variable movie clip based on variable thumbX
          t.numb = i;//Set sub-variable 'numb' inside variable t to hold index number
          t._alpha = 75;//Set the Alpha value of the variable movie clip to 75% - for onRollOver highlight action
          thumbX += 55;//Increment thumbX value so next thumbnail is placed 125 pixels to the right of the one before
          t.onRollOver = function() {//define onRollOver event of the variable movie clip
               this._alpha = 100;//Set thumbnail alpha to 100% for highlight
          t.onRollOut = function() {//define onRollOut event of the variable movie clip
               this._alpha = 75;//Reset thumbnail alpha to 75%
          t.onPress = function() {//define onPress event of the variable movie clip
               this._rotation += 3;//rotates thumbnail 3 degrees to indicate it's been pressed
               this._x += 3;//Offset X coordinate by 3 pixels to keep clip centered during rotation
               this._y -= 3;//Offset Y coordinate by 3 pixels to keep clip centered during rotation
          t.onReleaseOutside = function() {//define onRelease event of the variable movie clip
               this._rotation -= 3;//rotate thumbnail back 3 degrees
               this._x -= 3;//Reset X coordinate by 3 pixels to keep clip centered during rotation
               this._y += 3;//Reset Y coordinate by 3 pixels to keep clip centered during rotation
               this._alpha = 75;//Reset thumbnail alpha to 75%
          t.onRelease = function() {//define onRelease function to load full sized image
               this._rotation -= 3;//rotate thumbnail back 3 degrees
               this._x -= 3;//Reset X coordinate by 3 pixels to keep clip centered during
               this._y += 3;//Reset Y coordinate by 3 pixels to keep clip centered during
               this._alpha = 75;//Reset thumbnail alpha to 75%
               holder.loadMovie(fullURL[this.numb]);//Load full sized image into holder clip based on sub-variable t.numb, referenced by 'this'
     holder.loadMovie(fullURL[0]);//Initially load first full size image into holder clip
// this one function scrolls the panel for all of the buttons, it gets the
// size of the panel when the images are loaded by any given button...
stroke.onEnterFrame = function() {
     if (this.hitTest(_xmouse, _ymouse, false)) {
          if (panel._x>=740) {
               panel._x = 740;
          if (panel._x<=740-panel._width+mask._width) {
               panel._x = 740-panel._width+mask._width;
          if ((panel._x<=740) && (panel._x>=740-panel._width+mask._width)) {
               var xdist = _xmouse-830;
               panel._x += -xdist/7;
Of note is the change to how the movie clips are measured... this change in and of itself has really helped to make the thumbnail panels operation more efficient.
Below is the script for each additional button: [Having issues with the forums not letting me post additional code, so I will put the remaining code in a reply below.]
cont.

Problems with Flash thumbnail gallery

Hi there,
I am an artist trying to remake my website...I have a picture of a window on my homepage. The window is a movie. When clicked on, the window lights turn on and a grid of thumbnail pics appear. Each thumbnail is a movie clip. When a thumbnail is clicked on, the movie plays and a larger image appears over the window. The problem is, the window is still active underneath the large image, so if I click on the large image, I am really clicking on the window movie clip underneath, and the thumbnail grid disappears-starting the window movie clip over. How do I make the window clip inactive after it is initially clicked?
Also, I would like the larger images to end their movie clips after another thumbnail is clicked, so that there aren't large images piled up on top of each other.
Is there anyone that can help?
Thanks in advance!!

Hi again,
First off, thanks so much for your continued help...
So, I changed my design a little and format. Now I'm using as3, with Flash CS5.
My thumbnail gallery is still based on the same concept, I want a movie clip of a window to be clicked on that reveals a thumb grid, but now the thumbnail gallery should appear over the window, and the large portfolio images appear in the blank space to the right. I followed a tutorial for the gallery, here's my code on the main timeline:
import flash.events.MouseEvent;
btn1.addEventListener(MouseEvent.CLICK, GetFirstImage)
function GetFirstImage (evt:MouseEvent) {
          gotoAndStop("pic1")
import flash.events.MouseEvent;
btn2.addEventListener(MouseEvent.CLICK, GetSecondImage)
function GetSecondImage (evt:MouseEvent) {
          gotoAndStop("pic2")
import flash.events.MouseEvent;
btn3.addEventListener(MouseEvent.CLICK, GetThirdImage)
function GetThirdImage (evt:MouseEvent) {
          gotoAndStop("pic3")
But now I don't know how to go about adding in the initial movie clip of the window (which when clicked should light up and fade into the thumbnail grid) Right now I just have the gallery set up. How do I set up a movie that contains my gallery?
Sorry if the question is redundant, but as you know, I'm new to actionscript.
Thanks!

Movie Clip Thumbnail Gallery

I'm using Flash 8 Professional
Here's the swf:
http://208.131.133.122/flash/
And my fla:
http://208.131.133.122/flash/scene.fla
(8MB sorry!)
Right now, when the mouse is in the same _x position as the
last thumbnail, the thumbnails slide gently to the left to reveal
more thumbnails then slide back to the right when the mouse moves
to the left again.
The problem is that they start sliding to the left whether or
not the mouse is over the thumbnail gallery. If the mouse is at the
bottom of the screen or the top of the screen and in the same _x
position as the last thumbnail, they will begin sliding.
I would like the thumbnails to begin sliding only when the
mouse hovers over the row of thumbnails and not when it is outside
that thumbnail area.
I added some actionscript to stop the movement of the
movieclip when the mouse is above the max or below the min _y
position of the clip; but, it does not work.
I don't really know what I'm doing. Can someone.... anyone...
tell me if this is something that can be done? And if yes, how?
Much thanks in advance.

I see that your first wooden button is a 'scroll down' button
which plays through
the length of the thumbnails. Do you mean you want to
replicate and reverse this on the third wooden button 'scroll up' ?
I'm just guessing here but I'd say you accually have your
thumbnail gallery scrolling down as a motion tween and your scroll
up button just has a 'goto previous frame' type function on it?
If the previous statement is true then I would suggest two
options for you.
1.) You take the scrolling functionality out of a timeline
and do it all with action script. This would be the most effective
way of doing it.
2.) Since you probably don't want to make serious edits to
that .fla. Here's another way. You have a boolean called 'is_rev'
and a function called 'play_backwards'. These are contained within
the same movie clip as your thumbnail gallery.

Your third wooden button has these actions on it.
on(release)
this.is_rev = true;
this.prevFrame(); // This is to start the reverse loop;
Your first wooden button would have this on it.
on(release)
this.is_rev = false;
this.play();
Your second wooden button would have this on it.
on(release)
this.is_rev = false;
The function would be:
function play_backwards()
if(this.is_rev)
this.preFrame();
Now on every single frame of your scrolling gallery you need
to call this.play_backwards();
Please note the way I structured the coding assumes every
object is on the same timeline. If your buttons are in a
different/parent movie clip relative to your gallery movie clip,
your going to need to make sure 'this' is set relative to the two
objects. (i.e. on your button -> this.prevFrame(); would
probably be this.gallery.prevFrame(); )
A quick design note. If your buttons symbolize scrolling not
movement they should be reversed since as the thumbnail gallery is
moving upwards the user is scrolling downwards.

Need help making javascript thumbnail gallery function in javascript tab menu

Hello all,
I have implemented a css/javascript tab menu on one of my html pages thanks to Chris Coyier (http://css-tricks.com/learning-jquery-fading-menu-replacing-content/), and within one of the tabs, which I labeled GALLERY, I am trying to place a thumbnail gallery curtosy of Trent (http://www.twospy.com/galleriffic/).
Before trying to place it in the menu, I made the gallery on a seperate html page to make sure that I could get it to work. It does. But when I place it in the menu it shows up on page load under the content of the first tab (labeled TOUR) and not in the gallery tab. In addition, once I click on the "gallery" tab the other tabs stop showing their content. I feel like I am missing something obvious. But I just can't figure out what. If anyone can help I would greatly appreciate it.
Thanks,
Natalie
Below is the code of my whole page:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Tour template</title>

<link rel="stylesheet" type="text/css" href="MenuFader/style.css">
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
        $(function(){
            $("#tour-button").css({
                opacity: 0.3
            $("#gallery-button").css({
                opacity: 0.3
            $("#page-wrap div.button").click(function(){
                $clicked = $(this);
                // if the button is not already "transformed" AND is not animated
                if ($clicked.css("opacity") != "1" && $clicked.is(":not(animated)")) {
                    $clicked.animate({
                        opacity: 1,
                        borderWidth: 5
                    }, 600 );
                    // each button div MUST have a "xx-button" and the target div must have an id "xx"
                    var idToLoad = $clicked.attr("id").split('-');
                    //we search trough the content for the visible div and we fade it out
                    $("#contents").find("div:visible").fadeOut("fast", function(){
                        //once the fade out is completed, we start to fade in the right div
                        $(this).parent().find("#"+idToLoad[0]).fadeIn();
                //we reset the other buttons to default style
                $clicked.siblings(".button").animate({
                    opacity: 0.5,
                    borderWidth: 1
                }, 600 );
</script>

<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<style type="text/css">

</style>

<title>Example tour page</title>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="Gallery/js/jquery.galleriffic.js"></script>
<script type="text/javascript" src="Gallery/js/jquery.opacityrollover.js"></script>
<script type="text/javascript">
            document.write('<style>.noscript { display: none; }</style>');
</script>
<link rel="stylesheet" type="text/css" href="Gallery/css/galleriffic-2.css">
<link rel="stylesheet" type="text/css" href="Gallery/css/basic.css">

</head>

<body>
<div id="realtor panel"><table width="100%" border="0">
<tr>
    <td width="18%"> <div align="center"></div></td>
    <td width="82%"> </td>
</tr>
</table>
</div>
<div id="page-wrap">
        <div id="tour-button" class="button">
            <img src="MenuFader/images/TOUR.png" alt="tour" class="button" />
        </div>
        <div id="gallery-button" class="button">
            <img src="MenuFader/images/GALLERY.png" alt="property gallery" class="button" />
        </div>
        <div id="info-button" class="button">
            <img src="MenuFader/images/INFO.png" alt="info" class="button" />
        </div>
        <div id="specs-button" class="button">
            <img src="MenuFader/images/SPECS.png" alt="specs" class="button" />
        </div>
        <div class="clear"></div>
<div id="contents">
    <div id="tour">
      <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','wid th','1270','height','443','src','swf files/Tudor Arms interative floor plan','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movi e','swf files/Tudor Arms interative floor plan' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="1270" height="443">
        <param name="movie" value="swf files/Tudor Arms interative floor plan.swf" />
        <param name="quality" value="high" />
        <embed src="swf files/Tudor Arms interative floor plan.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="1270" height="443"></embed>
      </object></noscript>
    </div>
    <div id="property gallery">
         <div id="container">
                <div id="gallery" class="content">
                    <div id="controls" class="controls"></div>
                    <div class="slideshow-container">
                        <div id="slideshow" class="slideshow"></div>
                    </div>
                </div>
                <div id="thumbs" class="navigation">
                    <ul class="thumbs noscript">
                        <li>
                            <a class="thumb" href="Gallery/images/example/apt entrance1.jpg">
                            <img src="Gallery/images/example/Tudor thumbs/apt face1.jpg" alt="apt entrance1" />
                            </a>
                       </li>
                      <li>
                            <a class="thumb" href="Gallery/images/example/apt entrance2.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/apt face2.jpg" alt="apt entrance2" />
                            </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/apt entrance3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/apt face3.jpg" alt="apt entrance3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/apt sign.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/apt sign.jpg" alt="apt sign" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/entryway1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/entry.jpg" alt="entry" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/living room1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/living1.jpg" alt="living1" />
                          </a>
                      </li>
                       <li>
                             <a class="thumb" href="Gallery/images/example/living room2.jpg" >
                             <img src="Gallery/images/example/Tudor thumbs/living2.jpg" alt="living3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/living room3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/living3.jpg" alt="living3" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/dining1.jpg" >
                             <img src="Gallery/images/example/Tudor thumbs/dining1.jpg" alt="dining1" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/Dining2.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/dining2.jpg" alt="dining2" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/dining3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/dining3.jpg" alt="dining3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/Kitchen1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/kitchen1.jpg" alt="kitchen1" />
                          </a>
                      </li>
                      <li>
                             <a class="thumb" href="Gallery/images/example/Kitchen2.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/kitchen2.jpg" alt="kitchen2" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/bedroom1.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/bed1.jpg" alt="bed1" />
                          </a>
                      </li>
                       <li>
                             <a class="thumb" href="Gallery/images/example/bedroom2.jpg">
                            <img src="Gallery/images/example/Tudor thumbs/bed2.jpg" alt="bed2" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/bedroom3.jpg" >
                            <img src="Gallery/images/example/Tudor thumbs/bed3.jpg" alt="bed3" />
                          </a>
                      </li>
                        <li>
                             <a class="thumb" href="Gallery/images/example/bathroom.jpg">
                            <img src="Gallery/images/example/Tudor thumbs/bath.jpg" alt="bath" />
                          </a>
                        </li>
                    </ul>
                </div>
            <div style="clear: both;"></div>
        </div>
    </div>
    <div id="info">
        <p class="style4">Content for info</p>
    </div>
    <div id="specs">
        <p class="style4">This content is for specs.</p>
    </div>
</div>
</div>

<script type="text/javascript">
            jQuery(document).ready(function($) {
                // We only want these styles applied when javascript is enabled
                $('div.navigation').css({'width' : '400px', 'float' : 'left'});
                $('div.content').css('display', 'block');
                // Initially set opacity on thumbs and add
                // additional styling for hover effect on thumbs
                var onMouseOutOpacity = 0.67;
                $('#thumbs ul.thumbs li').opacityrollover({
                    mouseOutOpacity:   onMouseOutOpacity,
                    mouseOverOpacity: 1.0,
                    fadeSpeed:         'fast',
                    exemptionSelector: '.selected'
                // Initialize Advanced Galleriffic Gallery
                var gallery = $('#thumbs').galleriffic({
                    delay:                     2500,
                    numThumbs:                 15,
                    preloadAhead:              10,
                    enableTopPager:            true,
                    enableBottomPager:         true,
                    maxPagesToShow:            7,
                    imageContainerSel:         '#slideshow',
                    controlsContainerSel:      '#controls',
                    captionContainerSel:       '#caption',
                    loadingContainerSel:       '#loading',
                    renderSSControls:          true,
                    renderNavControls:         true,
                    playLinkText:              'Play Slideshow',
                    pauseLinkText:             'Pause Slideshow',
                    prevLinkText:              '&lsaquo; Previous Photo',
                    nextLinkText:              'Next Photo &rsaquo;',
                    nextPageLinkText:          'Next &rsaquo;',
                    prevPageLinkText:          '&lsaquo; Prev',
                    enableHistory:             false,
                    autoStart:                 false,
                    syncTransitions:           true,
                    defaultTransitionDuration: 900,
                    onSlideChange:             function(prevIndex, nextIndex) {
                        // 'this' refers to the gallery, which is an extension of $('#thumbs')
                        this.find('ul.thumbs').children()
                            .eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
                            .eq(nextIndex).fadeTo('fast', 1.0);
                    onPageTransitionOut:       function(callback) {
                        this.fadeTo('fast', 0.0, callback);
                    onPageTransitionIn:        function() {
                        this.fadeTo('fast', 1.0);
</script>
</body>

</html>

Sure thing:
http://www.acresllc.net/TA501001.html

Help with scrolling image gallery?

Hi, using the code for a scrolling image gallery found here (Build an Infinite Scrolling Photo Banner With HTML and CSS | Design Shack). When I pasted in the CSS and HTML, it displayed all vertically and broke my title div. Not a professional, so I could use an expert eye to point out any mistakes. Trying to make title in vertical center of page, scrolling image gallery horizontal in the middle, and links directly below. HTML is below:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Marc Moss Art</title>



<link href="style.css" rel="stylesheet" type="text/css">
<link href="../../../../style.css" rel="stylesheet" type="text/css">

</head>
<body topmargin="600">
<div id="wrapper">
<div class="container">
<header></header>
<div id="content" style="height:300px;width:1000px;float:left;"><h1>art by marc moss</h1>
</div>
    
    <div class="photobanner">
        <img class="first" src="../../../../mosspictures/DSCN0038.JPG" alt="">
        <img src="../../../../mosspictures/DSCN0040.JPG" alt="">
        <img src="image-3.jpg" alt="">
        <img src="image-4.jpg" alt="">
        <img src="image-5.jpg" alt="">
        <img src="image-6.jpg" alt="">
        <img src="image-1.jpg" alt="">
        <img src="image-2.jpg" alt="">
        <img src="image-3.jpg" alt="">
        <img src="image-4.jpg" alt="">
    </div>
    <nav>
    <div id="navigation">
    <ul>
    <li><a href="#">bio</a></li>
    <li><a href= "#">inspiration</a></li>
    </ul>
    </div>
    </nav>
</article>
<footer>
</footer>
</div>
</div>
</body>
</html>

Is this supposed to be a WordPress site? None of these images are found on the server. Those folders don't exist either.
<img class="first" src="mosspictures/DSCN0038.JPG" alt="">
   <img src="mosspictures/DSCN0040.JPG" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-3.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-4.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-5.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-6.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-1.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-2.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-3.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-4.jpg" alt="">
Nancy O.

Help- how do I make images ready for web gallery??

Hi,
I am trying to create a photo gallery of images within Bridge using the Adobe Web Gallery feature. I have the images I want to use in a folder.What steps do I need to take to get the images saved in the correct format and file size? Also, what files sizes do you recommend for a web gallery? I need to make medium to large thumbnails & large images (when clicked). Here's what I am thinking I need in terms of getting this right:
use Adobe Photoshop/Bridge to create the gallery
jpg for photos
gif for solid colors
file size under 2MB (full image), under 20-30K for (thumbnails), total size of all images under 50K (no more than 50 sec. to download)
screen size: 984x728
screen resolution: 72dpi
If you could help me in any way, shape or form concerning making my images ready for a web gallery that would be most helpful. And if you can refer me to any resources on making a web gallery that'd be awesome. Thank you!
ashmic19

Thanks for the link Curt Y that video is really helpful. After looking through some materials I had I figured out how to optimize my images. So I don't need any help anymore. But thanks to all who viewed this and thanks Curt Y for the video!
ashmic19

Neet to make an as3 scrolling thumbnail gallery

Similar Messages

Maybe you are looking for