javascript - .slideDown() 不起作用

Question

这应该很容易，但我检查了谷歌并没有找到任何相关信息。

我正在做:

        $notification.slideDown(1000, function(){
            $('#notifications').append($notification);
        });

但是它并没有滑落。它在没有任何动画的情况下显示。也没有错误。

.slideUp() 工作正常。我在这里做错了什么？

jsFiddle

Answer 1

改变

  $notification.slideDown(1000, function () {
     $('#notifications').append($notification);
 });

至

  $('#notifications').append($notification.hide());
        $notification.slideDown(1000);

slideDown 不起作用的原因是当您追加元素时该元素是可见的

DEMO

另请注意，当您向上滑动通知时，您应该将其删除，否则您将有多个通知占据

$closeButton.click(function () {
    $(this).parent().slideUp(function () {
        $(this).remove();
    });
});