Click on a thumbnail, and that image temporarily becomes the background image for the page.
Click the page again to restore the document to its original appearance.
You can add as many thumbnails as needed.
<script type="text/javascript">
<!--
function change(e){
obj=(!e.target?event.srcElement:e.target)
elementType=obj.nodeName
if(elementType=="IMG"){
document.body.style.backgroundImage="url("+obj.src+")"
}
}
function restore(){
document.body.style.backgroundImage=''
}
document.onclick=restore
//-->
</script>
<style>
#tiletable img{
width:100px;
height:100px;
}
</style>
<id="tiletable" table border="5" cellspacing="0" onclick="change(event);event.cancelBubble=true" style="cursor:hand">
<tr>
<td><img src="pic1.jpg" alt="" title=""></td>
<td><img src="pic2.jpg" alt="" title=""></td>
<td><img src="pic3.jpg" alt="" title=""></td>
</tr>
</table>
