As the subject suggests, I'm interested in having a "picture/information" page on my site. I want a simple list of 5 to 10 thumbnailed pictures when the page loads in which each one is stacked on the other. I would like each to expand with a bigger picture and text information about the picture via user interaction. I have two options - I don't care which one I use:
#1. Once loaded, I would like each thumbnailed picture, once clicked
, to expand and show a bigger picture and text information about the picture. I wouldn't mind using this option but this option is more of a hassle and causes more clutter/less interaction.
#2. As I thought about this, I think a better option would be to expand to a bigger picture and text information using a mouse rollover
instead of a click so that, once a user moves the mouse back off the bigger picture and information, it reduces back to the thumnail. This would allow for a better organized and better looking page. This effect, I would assume, is almost like text links changing color using mouse rollover.
Which option would you suggest using?
Is option #2 even possible?
I would prefer using option #2.
I've experimented with this code (however, it used option #1, not #2, and it requires clicking an entirely different button to do so):
<input name="checker" type="hidden" id="checker" value="2" checker="1">
<img src="image.gif" name="main" width="100" height="100">
<input type="button" value=" Change " onclick="changeIt()">
Thanks ahead of time guys for any help,