JQUERY - 从左上/右上或左下/右更改Div尺寸

Question

我正在写我的个人网站，我有4个div包含在容器div中（见图）

现在点击我想将点击的div调整为容器的div维度

我做到了。

现在我的问题是有一种方法可以调整大小：

• 第二个是从右上角到左下角
• 第3个到左下角到右上角
• 从右下到左上角的第四个

HTML

http://pastebin.com/mid0ssC6

CSS

http://pastebin.com/sx4BL9Jv

JQUERY

http://pastebin.com/1yG3vkew

---

---

我找到了解决方案，我很快就会发布：）

Answer 1

要执行您正在寻找的动画级别，您的思维会有所改变。目前，您将图像布置为4个<div>元素，并将它们包装起来，因为它们的容器宽度会导致这样。相反，您需要在四个角使用CSS定位。请参阅relative positioning。

现在，为了为您希望的项目设置动画，您需要知道其最终所需大小及其最终所需的终点位置。然后，您将从起始大小和位置动画到期望持续时间内的最终值。调整大小将使其成为最终所需大小，但您还必须以与调整大小相同的速率移动图像的位置。例如，当新图标大50％时，其位置应该是从开始到结束的50％。如果我们认为图像的上/左是图像锚定的位置，那么它必须在每个＆＃34; tick＆＃34;以这种方式，你的运动图像的固定角落在完全相同的位置。

我意识到这不是一个针对您的编码解决方案，但Stack Exchange的本质更多是回答问题＆＃34;而不是它＃34;给我一个解决方案＆＃34;。

Answer 2

这是不完整的答案是另一个问题但从逻辑上解决问题的方法如下：

http://pastebin.com/izrfcJDq

显然，div的位置必须改为亲戚。

问题是必须定时while循环。

本机javascript方法SetInterval（）不适用于此目的，因为它在循环结束后仍然继续运行。