var directionTop = 'up';
var xTop = -280;
var xTopMin = -280;
var xTopMax = 0;
var xTopStep = 0;
var topSize = 280;
var overlapOffset = 0;

function doTopMove() {
   var tbar = document.getElementById('topbar');
   var box = document.getElementById('content');
   if (directionTop == 'up') { //muovi i layers in alto
     xTopStep = ((2*(xTop-xTopMin))/20) + 1
     xTop = xTop - xTopStep
     if (xTop < xTopMin) {
        xTop = xTopMin
     }
     tbar.style.top = xTop;
     if (((xTop - xTopMin) - overlapOffset)>0) {
        box.style.top = (xTop + topSize) - overlapOffset;
     } else {
        box.style.top = 0;
     }
     if (xTop > xTopMin) {
        setTimeout('doTopMove()',50);
     }         
   } else { //muovi i layers in basso
     xTopStep = ((2*(xTopMax-xTop))/20) + 1
     xTop = xTop + xTopStep
     if (xTop > xTopMax) {
        xTop = xTopMax
     }
     tbar.style.top = xTop;
     if ((xTop - xTopMin) > overlapOffset) {
        box.style.top = (xTop + topSize) - overlapOffset;
     }
     if (xTop < xTopMax) {
        setTimeout('doTopMove()',50);
     }
   }
}
    
function swapTop() {
    if (directionTop == 'up') {
       directionTop = 'down';
       doTopMove();
    } else {
       directionTop = 'up';
       doTopMove();
    }    
}