Ajax Image gallery / Open, Close Window Effect

Question

Can anyone point me in the direction of such a script? It should also be able to work when called into another ajax window. This is the type of gallery i am going for:

http://dageniusmarketer.com/DigitalWonderland/pages/DemoGalleryExample.html

It should go on this page:

dageniusmarketer.com/DigitalWonderland/

Portfolio section.

This script should be real simple to use with minimal extra files to make it work. I also should be able to just drop images in a gallery folder and it populates the gallery automatically with thumbnails....I shouldnt have to write code for each image in my html. Should be all dynamic.

---

I also would like to know how I could go about a window effect where every time I open up a new section via my navigation, the window shrinks closed with the old content, then expands open with the new content. the window effect should be vertical (top to bottom shrink into center, expand from center top to bottom)

Please Let me know. Thanks

Answer 1

JQuery is one of my personal favorite javascript libraries (along with 99% of this site apparently!)

But it will have a learning curve, as your requirements seem pretty specific, and you will have to read some documentation to pull it off.

Answer 2

Try Spry from Adobe. They have a very similar demo. Also, the other common frameworks for this would be prototype/scriptaculous, dojo, mootools, jquery. In many cases they have extensions that would provide the exact thing you are looking for. For example, try shadowbox extension which is framework agnostic. Best of luck!

Answer 3

Imago looks promising:

http://imago.codeboje.de/

Answer 4

Just discovered the very awesome-looking jQuery Tools library today. Meets your "simple and minimal" requirements and could probably pull off what you've sketched, with just the "tooltips" and "scrollable" components.

I also should be able to just drop images in a gallery folder and it populates the gallery automatically with thumbnails

My instinct is that you'd be better off writing server-side code to handle this part of your requirement.

Answer 5

Im having a problem.

I went with the imago gallery recommended by Mattk311, and i got it to look the way I want, which you can see here:

http://dageniusmarketer.com/DigitalWonderland/pages/Portfolio.html

Now, I can get it to load into its own page fine with no problems, but when I try to load it into the main div from:

dageniusmarketer.com/DigitalWonderland

in the portfolio section, all I get is a line of code, with no gallery. Could someone take a quick look at my view source and tell me whats stoppping this from loading? It wouldnt load another ajax gallery I tried before, so i have to believe its something with my index.html, I just dont know what.

If anyone can tell me how to fix it, much appreciated.

P.S. how could i make it where when i click the large image, it opens up bigger with the lightbox effect?

Thanks in advance guys.

Answer 6

Does anybody have any input?