Работает все равно не так как надо - убирается слишком быстро.
Попробовал такой вариант.
var endWidth=0;
var interval;
function resize()
{
document.getElementById("leftTop").width = document.getElementById("leftTop").width-1;
document.getElementById("leftMiddle").width = document.getElementById("leftMiddle").width-1;
document.getElementById("leftBottom").width = document.getElementById("leftBottom").width-1;
document.getElementById("rightTop").width = 100;
document.getElementById("rightMiddle").width = 100;
document.getElementById("rightBottom").width = 100;
document.getElementById("middleTop").width = document.getElementById("middleTop").width+1;
document.getElementById("middleMiddle").width = document.getElementById("middleMiddle").width+1;
document.getElementById("middleBottom").width = document.getElementById("middleBottom").width+1;
document.getElementById("mainTable").width = 1000;
if (document.getElementById("middleTop").width == endWidth) clearInterval(interval);
}
function resizeLeft()
{
interval = setInterval('resize()', 10);
}
Все равно не работает, ко всему прочему при увеличении интервала видно что граница сначала резко прыгает в право, а лишь затем рывками влево.
А по позже я попробовал вот такой вариант он работает практически идеально, но скорость работы практически не регулирутся получается весьма тормознуто.
var endWidth=0;
var interval;
function resize()
{
var nextLeftWidth = parseInt(document.getElementById("leftTop").width) - 1;
document.getElementById("leftTop").width = nextLeftWidth + " px";
document.getElementById("leftMiddle").width = nextLeftWidth + " px";
document.getElementById("leftBottom").width = nextLeftWidth + " px";
document.getElementById("rightTop").width = 100 + " px";
document.getElementById("rightMiddle").width = 100 + " px";
document.getElementById("rightBottom").width = 100 + " px";
var nextMiddleWidth = parseInt(document.getElementById("middleTop").width) + 1;
document.getElementById("middleTop").width = nextMiddleWidth + " px";
document.getElementById("middleMiddle").width = nextMiddleWidth + " px";
document.getElementById("middleBottom").width = nextMiddleWidth + " px";
document.getElementById("mainTable").width = 1000 + " px";
if (document.getElementById("middleTop").width == endWidth) clearInterval(interval);
}
function resizeLeft()
{
interval = setInterval('resize()', 2);
}