Question

如何在JQuery中移动div并使用动画效果调整大小？

即。 div将位于屏幕的中间，它将向左侧移动，并且在完成移动后将具有其高度的％50和其宽度的％50。（例如，它将具有中间尺寸的％75它的方式）

编辑：我试过了：

$(".block").animate({"left": "-=100px", "height": "-=30%", "width":"-=30%" }, 1000);

然而它消失了？

EDIT2： 这有效：

$(".block").animate({"left": "-=100px", "height": "30%", "width":"30%" }, 1000);

然而它让我的方块更大，我尝试= -30％但不起作用。我应该做些什么来变小而不是变大？

Answer 1

似乎最后一行是将高度和宽度css属性设置为30％。您希望它是以前尺寸的30％，但它实际上是块的最近尺寸父版的30％，这似乎比以前的尺寸大。

我认为没有一种简单的方法可以调整大小到以前大小的给定百分比（就像动画中的特殊语法一样）。我假设你必须编写一个javascript函数来计算旧的宽度。

鉴于您只想调整一个元素的大小，我强烈建议您使用元素ID而不是其类。然后以下行应该做你想要的：

$("#block").animate({"left": "-=100px", "height": $("#block").height()*0.5, "width":$("#block").width()*0.5 }, 1000);

Answer 2

您可以使用jQuery的animate功能。您可以查看以下链接：

  http://api.jquery.com/animate/

在上面的链接中，示例显示了您想要的所有内容（例如使用动画更改宽度）。请查看示例。