Image gallery - newbie

[homerzzz]

Hi,

I have an image gallery created with a table. I would like it to highligt the border around the image that is focused on, and also at the same time display a buttonimage above the image for saving the image inside the div. (Like imagesearch on askx.com). I can do this for a single image by using it's "id" but how do I do this with multiple images? And how will I hide/show the specific savebutton for each image?

Example:
<table border="0" id="pictable">
<tr><td><div class="selectedpic"this.style.borderColor='blue';" onmouseout="this.style.borderColor='white';"><img src="savebutton.gif"/><br /><img src="image1.jpg"/></div></td>
<td>image2</td><td>image3</td><td>image4</td>........</tr></table>
and so on... you get the idea.

Thank you for your time!

[acoder]

Welcome to TSDN.

Use the visibility property. Set it to 'visible' to show and 'hidden' to hide.

document.getElementById(id).style.visibility='visible'

[homerzzz]

Welcome to TSDN.

Use the visibility property. Set it to 'visible' to show and 'hidden' to hide.

document.getElementById(id).style.visibility='visible'

Thanks!

But the problem is that I have one button per image. That means that I cannot reuse the same Id on them. I dont want to write 700 scripts if my gallery contains 700 images. How do I make a general script for the whole gallery? Thanks again.

[acoder]

Just pass the id to a function with "id" as the argument/parameter name. Then you can use the generalised id to set the visibility for any image.

function show(id) {
document.getElementById(id).style.visibility='visible';
}