Code
<html>
<head>
<title>Перелистывание страниц</title>
<meta name=vs_defaultClientScript content="JavaScript">
<meta name=vs_targetSchema content="http://schemas.microsoft.com/intellisense/ie5">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251;charset=windows-1251" />
<meta http-equiv="Content-Language" content="ru" />
</head>
<body>
<table>
<tr>
<td><div onmousemove="mousemove(this)" style="overflow: hidden; width:50"><img src="/flip/img10000.jpg"></div></td>
<td><div onmousemove="mousemove(this)" style="overflow: hidden; width:50"><img src="/flip/img20000.jpg"></div></td>
<td><div onmousemove="mousemove(this)" style="overflow: hidden; width:50"><img src="/flip/img30000.jpg"></div></td>
<td><div onmousemove="mousemove(this)" style="overflow: hidden; width:50"><img src="/flip/img40000.jpg"></div></td>
<td><div onmousemove="mousemove(this)" style="overflow: hidden; width:50"><img src="/flip/img50000.jpg"></div></td>
<td><div onmousemove="mousemove(this)" style="overflow: hidden; width:50"><img src="/flip//img60000.jpg"></div></td>
<td><div onmousemove="mousemove(this)" style="overflow: hidden; width:50"><img src="/flip/img70000.jpg"></div></td>
<td><div id="lastdiv" onmousemove="mousemove(this)" style="overflow: hidden"><img src="/flip/img80000.jpg"></div></td>
</tr>
</table>
</body>
<script>
var bigObj = document.getElementById("lastdiv"), curObj;
var run = false;
function mousemove(obj) {
if ((obj != bigObj) && (!run)) {
curObj = obj;
run = true;
changeWidth();
}
}
function changeWidth() {
curObj.style.width = curObj.offsetWidth + 25;
bigObj.style.width = bigObj.offsetWidth - 25;
if (curObj.offsetWidth < 500)
setTimeout(changeWidth, 1);
else {
bigObj = curObj;
run = false;
}
}
</script>
</html>