javascript - jQuery：向上滑动元素并替换它

Question

我正在尝试使用 jQuery 来制作它，以便当我单击一个元素时，它会向上滑动，并创建一个新元素，该元素会向下滑动到它的位置。

我的代码在这里：http: //jsfiddle.net/V4SVt/474/

$('.grab_button').click(function () {
    $(this).slideUp(function () {
        $(this).parent().append($('<span class=" grabbed">grabbed</span>').hide());
        $(this).parent().children('.grabbed').slideDown();
        $(this).remove();
    });
});

当我单击元素时，它会完美滑出，并创建新元素，但它不会向下滑动。它只是出现。如果我随后隐藏该元素，然后通过 WebKit 控制台将其向下滑动，则它会正确设置动画。这里有什么问题？

Answer 1

滑动内联元素存在问题，特别是如果它们是动态插入的并且没有位置、大小或其他任何东西。

试试这个：

$('.grab_button').click(function () {
    var assGrab = $('<span />', {'class':'grabbed', text:'grabbed', style:'display:inline-block;'});
    $(this).slideUp(function () {
        $(this).replaceWith(assGrab.hide());
        assGrab.slideDown()
    });
});

小提琴