小编jar*_*mie的帖子

我有一个类似于mac os中的通知的容器 - 元素被添加到队列中并在特定超时后被删除.这很好用,但有一个不和谐的视觉副作用.

当它们从DOM中移除时,对UI进行锯齿状更新,因为堆栈中的下一个元素填充了前一个元素创建的空白.我希望堆栈中的下面的元素能够顺利地向上移动到那个空间,理想情况下是使用css3,但是当删除它的兄弟时transition: all 0.5s ease-in-out,向.notice该类添加一个对该对象没有影响.

最小的JS干涉:

$('#add').click(function(e) {
    e.preventDefault();
    $('#container').append('<p class="notice">Notice #</p>');
});

$('body').on('click','p.notice', function(e) {
    $(this).fadeOut();
});

更好的是在这里摆弄:

http://jsfiddle.net/kMxqj/

我正在使用MVC框架对这些对象进行数据绑定,因此一些原生css/jQuery比Jq插件更受欢迎.