Javascript 平滑动画效果

我试图让我的div在向下和向后移动时移动得更平滑，这很难描述，但是如果你看一下链接，你就会开始理解我的意思， 以下是该网页的示例结构：

<div id="window">
    <div id="title_bar">
        <div id="button">-</div>
    </div>
    <div id="box">
    </div>
 </div>

-

这里有一种方法：

CSS:

JavaScript:

$("#button").click(function(){
    $("#box").slideToggle();

    if($(this).html() == "-"){

        $(this).html("+");
        setTimeout(function() {
            $('#window').css('top', 'auto');
            $('#window').animate({ 'bottom': '0' }, 500);
        }, 500);
    }
    else{
        $(this).html("-");

        setTimeout(function() {
            $('#window').animate({ 'top': '0' }, 500);
            $('#window').css('bottom', 'auto');
        }, 500);
    }
});

---

在FF中工作，我没有测试过其他浏览器。

“#widnow”

？检查拼写。不要真的注意到当它在页面上上下移动时，它的速度非常快，看起来不受控制。

$("#button").click(function(){
    $("#box").slideToggle();

    if($(this).html() == "-"){

        $(this).html("+");
        setTimeout(function() {
            $('#window').css('top', 'auto');
            $('#window').animate({ 'bottom': '0' }, 500);
        }, 500);
    }
    else{
        $(this).html("-");

        setTimeout(function() {
            $('#window').animate({ 'top': '0' }, 500);
            $('#window').css('bottom', 'auto');
        }, 500);
    }
});