代码之家 › 专栏 › 技术社区 › Andy Evans

.animate()和.remove()一起玩得不好

appendto jquery-animate jquery-ui jquery

Andy Evans · 技术社区 · 10 年前

我试图撤销我之前附加在正文中的通知面板。

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'});

这本身效果很好,但我的目标是移动div对象,因此我添加了.remove()语句以在动画完成后删除它。

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'});
$('#notify-panel').remove();

当我运行此命令时,面板将从主体中移除,但动画不会执行,层将消失。所以我添加了.remove()作为回调的一部分。

$('#notify-panel').animate({top: -250},{duration: 1000, easing: 'easeInOutBack'}, {callback: function(){ $(this).remove(); }});

这与上一步骤相同,在该步骤中,从未设置动画来移除层。所以我的问题是,如果我想设置一个div层的动画,然后删除它,我该怎么做呢。显然,我做错了什么。

2 回复 | 直到 10 年前

Salman Arshad 10 年前

这本可以通过以下方式解决 reading the manual 。使用以下选项之一:

$('#notify-panel').animate({
    top: -250
}, {
    duration: 1000,
    easing: 'easeInOutBack',
    complete: function() {
        $(this).remove();
    }
});

或:

$('#notify-panel').animate({
    top: -250
}, {
    duration: 1000,
    easing: 'easeInOutBack'
}, function() {
    $(this).remove();
});

Salman Arshad 10 年前

首先,缺少值和像素周围的引号。

我会这样写:

$('#notify-panel').animate({
    top: '-250px'
}, {
    easing: 'easeInOutBack'
}, 1000, function() {
    $(this).remove();
});

推荐文章

G. Ball. · 无法淡出数组中的特定元素

6 年前

Dahnteyy · jquery scrollTop动画功能不工作

6 年前

dihakz · 如何让jQuery从最后一个位置设置动画到新位置?

6 年前

Jimmy · jquery addclass之后的css转换

7 年前

Referee Andy · 延迟后添加的淡入/淡出div

7 年前

user2587454 · 使用动画从下至上展开div

7 年前

Jasbir · 动画编号需要在60秒内停止

7 年前

John Holliday · 自动滚动(aos)不在Wordpress中加载

7 年前

da_root · 动画JSON值的计数并替换null

7 年前

yl2201 · Jquery动画未在指定为%

7 年前