jquery - jQuery div 拼图

Question

我在网站上有三个专栏。每列都有带有信息的 div（列中大约 20-30。ID 命名为 left-a..z、center-a..z、right-a..z）。我需要从中心和右列隐藏一些不重要的 div，并将左列中的一些 div 放置到中心或右列。

我通过这种方式解决了这个问题：

小提琴

$(function(){
    $("#wrapper > #right1").fadeOut(1000).attr('id','right1-chg');
    $("#wrapper > #left-name").fadeOut(1000).attr('id','right1');
    $("#wrapper > #right1").fadeIn(1000);

    $("#wrapper > #right2").fadeOut(1000).attr('id','right2-chg');;
    $("#wrapper > #left-surname").attr('id','right2');
});

$(function(){
    $(".click").click(function(){
    $("#wrapper > #right1").attr('id','left-name');
    $("#wrapper > #right1-chg").attr('id','right1').fadeIn(3000);
    $("#wrapper > #left-name").fadeIn(1000);

    $("#wrapper > #right2").attr('id','left-surname');
    $("#wrapper > #right2-chg").attr('id','right2').fadeIn(3000);
    $("#wrapper > #left-surname").fadeIn(1000);
    $(".click").hide();
});

});

但：

1. 这似乎不是最好的解决方案。如何编写更具可读性的代码。
2. 移动另一个 div 后如何将底部 div 移动到释放空间？您可以使用#left-phone 看到这个问题。（我认为与我的代码相同，但它会产生很多代码行）

Answer 1

我更改了代码：

   ([http://jsfiddle.net/dimaomni/SThaQ/8/][1])

有用。谢谢