PDA

View Full Version : Image Jump?



mxtaylor
04 Nov 2005, 12:39 AM
Hi, I want to make a web page with thumbnails along the side and when you click on them you will see a larger image of that thumbnail in the center of the same page. I'm a little rusty and unsure of how to do it. ANy help is appreciated.

dingo
04 Nov 2005, 11:21 AM
Hi
You could do it with javascript or flash.
I haven't tested this code, so I don't know if it works, but give it a try.

Put this in your <head> element, below anything else in there:


<script>
function loadImg(url) {
var bigImg = document.getElementById("bigImg");
bigImg.src = url;
}
</script>


Put this kind of thing where you want the thumbnails:


<a href="javascript:void(loadImg('big_1.jpg'))">
<img src="tn_1.jpg" alt="Thumbnail image 1" />
</a>
<a href="javascript:void(loadImg('big_2.jpg'))">
<img src="tn_2.jpg" alt="Thumbnail image 1" />
</a>


And this where you want your full image:


<img src="big_1.jpg" alt="Full image" id="bigImg" />



Without some kind of server-side script you must upload seperate image files for the thumbnail and the full image (for example, here I used big_1.jpg and tn_1.jpg).
Hope this helps.