Javascript Code
< !-- Script by hscripts.com -->
<script language=javascript>
var lastsel = 0;
function SelectImage(id)
{
if (lastsel > 0)
{
document.getElementById(lastsel).className = "normal";
}
document.getElementById(id).className = "sel";
var srcnam = document.getElementById(id).src;
document.getElementById(0).src = srcnam;
lastsel = id;
}
function LoadTrigger()
{
SelectImage(1);
}
window.onload = LoadTrigger;
</script>
< !-- Script by hscripts.com -->
HTML Code
<div align=center>
<b>Move the mouse over an image on left side to view its full size.</b>
</div>
<table border=0 align=center>
<tr><td valign=top>
<img id=1 class="normal" src="rabbit.jpg" width=100 onmousemove="SelectImage(1)">
<br><img id=2 class="normal" src="cat.jpg" width=120 onmousemove="SelectImage(2)">
<br><img id=3 class="normal" src="dog.jpg" width=100 onmousemove="SelectImage(3)">
</td>
<td width=15> </td>
<td valign=top>
<img id=0 src="" width=400 height=300>
</td></tr>
</table>
CSS Code
<style>
body
{
background-color:#000000;
}
.normal
{
border:4px solid #000000;
}
.sel
{
border:4px solid #ff0000;
}
</style>
Get free version without ©copyright link for just
5
|