var dy = 6;           // Pixels to move for each time interval
var t = 20;            // Time interval (in milliseconds)
var mIntrvl;           // Identifier for setInterval and clearInterval
var topStop = -400;    // Top position for hidden div
var bottomStop = 2;  // Bottom position for hidden div

function show() {
    // Clear mIntrvl if already set.
    if (mIntrvl) {
        clearInterval(mIntrvl);
    }
    // Start the div moving in.
    mIntrvl = setInterval(move_down, t);
    
}
function hide() {
    // Clear mIntrvl if already set.
    if (mIntrvl) {
        clearInterval(mIntrvl);
    }
    // Start moving it out.
    mIntrvl = setInterval(move_up, t);
}
function move_down() {
    var win = document.getElementById('hidden_div');
    // Old top property without the "px".
    var old = parseInt(win.style.top);
    // If we're done moving down, stop calling this function.
    if (old >= bottomStop) {
        win.style.top = bottomStop + 'px';
        clearInterval(mIntrvl);
        mIntrvl = null;
        return;
    }
    // Move the div/window down.
    win.style.top = old + dy + 'px';
}
function move_up() {
    var win = document.getElementById('hidden_div');
    // Old top property without the "px".
    var old = parseInt(win.style.top);
    // If we're done moving up, stop calling this function.
    if (old <= topStop) {
        win.style.top = topStop + 'px';
        clearInterval(mIntrvl);
        mIntvl = null;
        return;
    }
    // Move the div/window up.
    win.style.top = old - dy + 'px';
}