如何在容器内保留动画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/

来源

2016-03-08 Marius ' Romania' Talpos

你拨弄工作吧...的方式看起来你需要为与扩展有关的每个按钮添加一些条件......看起来他们都扩展到了正确的大小......但是他们没有被重新定位，你需要修改顶部的x，y除了配置文件以外，每个按钮的左上角（因为那个s馅饼在左上方，不需要重新定位）...至少多数民众赞成在第一眼看起来像 – ewizard

重新定位它们将是不一致的，因为左上角的瓷砖不需要重新定位，只有其他三个会正在移动Im试图让瓷砖向其他瓷砖所留下的开放空间方向扩展 –

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

来源

2016-03-08 04:13:09 Nate

您可以添加更多详细信息以说明为什么添加'top：0，left：0'解决此问题的原因？ – Shubh

我很惊讶，这是这么简单！虽然我不知道为什么它可以正常工作，但无论如何，谢谢你 –

当你在css中使用0时......它被绝对使用......所以它基本上意味着，无论如何，将'div'放在顶部，并一直走到左边。 – ewizard

如何在容器内保留动画div

回答

相关问题