Нанести анимации на клоне и удаление функции

Question

У меня есть клон и удалить функции на моей странице, к которой я хочу, чтобы применить slideDown/slideUp анимации соответственно:

$('#add-item').click(function(){ 
    var divCloned = $('.form-fields:first').clone(); 
    divCloned.insertAfter('.form-fields:last'); 
    return false; 
}); 

$('.remove').live('click', function(){ 
    if(confirm("Are you sure you wish to remove this item?")) 
    { 
     $(this).parent().remove(); 
    } 
    return false; 
}); 

Я попытался сделать это, но либо он Безразлично» t или анимация очень рывкая. Кто-нибудь знает, как это можно сделать?

Answer 1

для клонирования

$('#add-item').click(function(){ 
    var divCloned = $('.form-fields:first').clone(); 
    // first we hide it (set display to none), then we add it in the DOM 
    // and lastly we aninmate it with slideDown 
    divCloned.hide().insertAfter('.form-fields:last').slideDown('fast'); 
    return false; 
}); 

и для удаления

$('.remove').live('click', function(){ 
    if(confirm("Are you sure you wish to remove this item?")) 
    { 
     // we use the callback method of the slideUp function 
     // so that the removal happens after the animation.. 
     $(this).parent().slideUp('fast',function(){ $(this).remove(); }); 
    } 
    return false; 
}); 

Demo в http://www.jsfiddle.net/gaby/qf4j3/