Transition position change when element removed from DOM

Question

I have a vertical list of images that the user can delete by clicking on them. Once the element is removed from DOM, the next element in line snaps upward to its position. How can I do a smooth CSS transition for this position change?

http://jsbin.com/dewiqilope/edit?html,js,output

Answer 1

You can use jQuery animations.

$('#element-selector').on('click', function () {
    $(this).slideUp(); // also you can use .fadeOut()
});