javascript - Div 在单击 / JS 时不会向上滑动

Question

我有一个小问题，我似乎无法解决。

我的动画函数的功能有问题。单击 div 时，它会完全向下滑动，但是当我再次单击 div 时，它不会向上滑动。

那是我使用的代码....

$("#menu").click(function () {
    if($(this).offset().bottom == -40) {
        $(this).animate({'bottom': '0px'}, 1000);
    }
    else {
        $(this).animate({'bottom': '-40px'}, 1000);
    } 

});

但是，当我的 div 位于页面的顶部、左侧或右侧而不是底部时，它工作得非常好？那是我不明白的事情......但我必须说，我对 Js 很陌生。

我在这里设置了一个 jsFiddle ... http://jsfiddle.net/JmLqp/438/

有什么建议么？

谢谢，乙

Answer 1

更改 JS 以检查 div 的bottom值，并从中进行动画处理。小提琴

$("#menu").click(function () {
    if($(this).css('bottom') == '-40px') {
        $(this).animate({'bottom': '0px'}, 1000);
    }
    else {
        $(this).animate({'bottom': '-40px'}, 1000);
   }     
});

Answer 2

看起来您没有从$(this).offset().bottom. 你可以这样做：

var status = "up"
$("#menu").click(function () {
    if(status == "up") {   
       status = "down"
        $(this).animate({'bottom': '100px'}, 1000);
    }
    else {
        $(this).animate({'bottom': '-30px'}, 1000);
         status = "down"
    } 

});