如何将动画div保留在容器中

Question

我在另一个容器div中有4个图块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