Date: 01/31/07 (WebDesign)    Keywords: web

I'm building a portfolio site of my print design work. My goal is a very simple, clean homepage - essentially one column on the left with a list of my work. When someone clicks on one of the items, say "Poster design for art show"...an image of the poster design will pop up. When a different item is clicked, the new image pops up where the poster image used to be.

With some googling, I learned how to set "Show-Hide Layers" in the Behaviors panel, and it works. The problem is that I have about thirty items in my portfolio (each image is on a separate layer), and it's insanely tedious to go through and click "hide" on 29 other layers. It's easy to make mistakes, and I already dread updating. Also, I'm running into a problem where some layers don't get hidden if they're clicked in a certain order, and all sorts of weird quirks.

There must be an easier way to accomplish the click-and-show-image-in-one-spot goal...after all, tons of websites use this interface. I want to learn how to do this the RIGHT way and have a perfectly functioning page and clean code!

Any helpful advice or links to tutorials?

Source: http://community.livejournal.com/webdesign/1214876.html