Best method for photo gallery

They have: 1 posts

Joined: Feb 2009

I am trying to develop a photo gallery and the issue that I am running accross is that some people, and companies have javascript disabled so I am leery about making a java-based page. Teh issue I am running accross is that CSS seems to be my best bet. I have been playing with several methods and yet to find one that works. I have the page set up with three columns. The Left Column is for the navigation bar the Center column is for the Pictures to be displayed, and the third column is for the thumbnails to be displayed. There will be several thumbnails so I want that column to scroll up or down as needed. I have tried several methods and yet to find one to work. The closest I have found is the thumbnails and main pic are in the same DIV but when you scroll down, the picture is now above the viewing window. I tried to put the thumbnail code in the DIV for the right column, but it didn't work. Any suggestions to make this work, or another method?

Thanks, I want to stop pulling my hair out!!!

pr0gr4mm3r's picture

He has: 1,502 posts

Joined: Sep 2006

This HTML & CSS should get you started. The right column will scroll, and the left one is for the large picture. I am not sure how do swap the pictures out w/o Javascript.

Adjust the widths/heights in the CSS as necessary. I have the borders in there to make the edges visible.

<style>
#container{
border: 1px solid;
margin: 0;
padding: 0;
width: 604px;
}

#container #large{
border: 1px solid;
margin: 0;
float: left;
width: 450px;
}

#container #thumbs {
border: 1px solid;
margin: 0;
float: left;
width: 150px;

height: 300px;
overflow-y: scroll;
overflow-x: hidden;
}
</style>

<div id="container">
<div id="large">
&nbsp;
</div>

<div id="thumbs">
&nbsp;
</div>

<div style="clear: both;"></div>
</div>

decibel.places's picture

He has: 1,494 posts

Joined: Jun 2008

poporacer wrote:
some people, and companies have javascript disabled so I am leery about making a java-based page

JavaScript and Java are two different languages Sticking out tongue (most Java apps require a download to work)

Anyway welcome to TWF! Laughing out loud

So you want to roll your own? I usually start with some existing code to adapt - there are some good scripts at Dynamic Drive (I am sure they require JavaScript)

Here are some Google results for galleries that work with JS disabled

I can also recommend Gallery2 and Drupal has some ok galleries out of the box

Megan's picture

She has: 11,421 posts

Joined: Jun 1999

Can you post a link to what you have so far?

Another good option for a larger photo gallery is Zenphoto. It's clean and simple and takes care of a lot of the grunt work for you (creating thumbnails, linking etc.)

Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.