javascript - 如何在容器中保持动画div

Question

我在另一个容器 div 中有 4 个 tile div。

当点击一个 div 时，其他 3 个消失。

我试图让点击的 div 在点击后填充容器 div 但它没有工作。

我怎样才能让 div 向我最小化的 div 留下的空白区域设置动画？

这是我的代码，唯一的区别是 div 的位置，因为 JsFiddle 的结果窗口比我的浏览器小:

<h1 id ='title'>Welcome to TalposMedia</h1>
<div class='navTilesContainer'>
    <div id="profile" class="navTile topLeft"><p>Profile</p></div>
    <div id="contact" class="navTile topRight"><p>Contact</p></div>
    <div id="showcase" class="navTile bottomLeft"><p>Showcase</p></div>
    <div id="resume" class="navTile bottomRight"><p>Resume</p></div>
</div>

https://jsfiddle.net/w15ond4L/

Answer 1

    $target.animate({
        height  : '+=335px',
        width   : '100%',
        top     : 0,
        left    : 0