如何使用动画（jQuery）将子元素从一个父元素移动到另一个父元素答案

【问题标题】：How to move child element from one parent to another with animation (jQuery)如何使用动画（jQuery）将子元素从一个父元素移动到另一个父元素
【发布时间】：2014-05-31 08:40:01
【问题描述】：

我制作了一个切换函数，它使用来自HERE 的一些代码更改子元素的父元素。但我想知道是否有办法用动画改变父级，因为现在它只是从一个 div 跳转到另一个。

This is the fiddle

这是一些代码：

function SW()
{
    $("#SW").toggle(function(){
        var element = $("#RelativeChild").detach().appendTo("#ParentRight");
    },
    function(){
        var element = $("#RelativeChild").detach().appendTo("#ParentLeft");
    });
}

【问题讨论】：

标签： jquery animation append detach

【解决方案1】：

这样做：

var element = $("#RelativeChild").hide('fade').detach().appendTo("#ParentRight")
.end().show('fade');

全功能：

function SW() {
    $("#SW").toggle(function () {
        var element = $("#RelativeChild").hide('fade').detach().appendTo("#ParentRight")
        .end().show('fade');
    },

    function () {
        var element = $("#RelativeChild").hide('fade').detach().appendTo("#ParentLeft")
        .end().show('fade');
    });
}

Demo

【讨论】：