jquery爆炸对图像的影响

Question

我怎样才能做类似于jquery的爆炸效果的东西，但是它实际上不会消失？我想要做的是将图像的四个角分开并将它们展开以显示整个图像所在的框。我已经制作了4个单独的图像，但我无法弄清楚如何将它们分开或“爆炸”它们。我试过让它们浮动，然后动画父div的宽度和高度。这是水平但不垂直的。任何人都有一个想法如何实现这一目标？

基本上，在查看了爆炸效果的源代码之后，我希望爆炸效果尽可能地隐藏在最后。无论如何，如果没有重写效果，那么这样做吗？

Answer 1

您可以使用4个绝对div替换图像，每个div占图像大小的1/4，并放在一起以设置一个框。然后将图像设置为每个div中的背景，每个div获得不同的背景位置，以便形成图像。然后使用jQuery的animate函数为每个div设置top / left / right / bottom的动画，使其分开。此外，您可以使用带有动画的jQuery的easing插件来使动画看起来像您想要的那样。