Javascript Jquery在设置的宽度上设置下一个div的动画

我问了一个类似的问题，我得到了这个答案，但是当我试图把它转移到可用标记时，我很幸运

基本上，我有4个div乘3个div的行，当单击它们时，我需要以下div在网格中的所有其他div上展开，并在需要时切换。我尝试过使用动画和切换，但没有效果。这里有一个使用表的示例

如果可能的话，我需要使用nexr方法以相同的方式（通过切换关闭）使用以下标记

谢谢

  <!--div in the grid--><div class="gridBox" id="one"></div>
    <div class="pop" id="bigOne">Content here and a toggle link</div><!--This div needs to expand over the full grid-->

 <!--div in the grid--><div class="gridBox" id="two"></div>
    <div class="pop" id="bigTwo">Content here and a toggle link</div><!--This div needs to expand over the full grid-->

这里有内容和切换链接
这里有内容和切换链接

---

干杯我想我自己说得不够清楚，我想让它做的是在上面的代码示例中，有一个网格布局，每个单元格都是一个div，当你点击div时，它会设置动画并显示下一个div，在该div下隐藏到该点

var top = 0,
    left = 0;

$("td").click(function() {
    var ref = $(this);
    if ($(this).hasClass('currentAnimated')) {
        $(this).css({
            "z-index": 1
        }).animate({
            top: top,
            left: left,
            width: "40px",
            height: "39px"
        }, "4s", function() {
            ref.removeClass('currentAnimated');
        })
    } else {
        top = $(this).position().top;
        left = $(this).position().left;
        $(this).css({
            "z-index": 1
        }).animate({
            top: 0,
            left: 0,
            width: "120px",
            height: "120px"
        }, "4s", function() {
            ref.addClass('currentAnimated')
        });
    }
});