Question

Trying to make a image based button that will change a image on the page

Here is the code I have

<script type="text/javascript">

function nextimg()
{
alert("clicked")
document.getElementById("image").src="images/gallery/gallery-2.jpg";
}

</script>
<div class="gallery">
<table>
<tr>
<td><img src="images/lt_arrow_dark.png"/></td>
<td><img id="image" src="images/gallery/gallery-1.jpg"/></td>
<td><img onclick="nextimg()" src="images/rt_arrow_dark.png" height="55" width="24"/></td>
</tr>
</table>
</div>

Nothing happens when I click on the image. Any Ideas? Thanks

Answer 1

You need to remove the z-index of -2 in your css.

.gallery {
    background-color:#090909;
    position:relative;
    top:60px;
    width:100%;
}

Live DEMO