如何让一个div像漂浮的气球一样上下移动

Question

概述

我希望一个div能够缓慢地上下移动，看起来像气球漂浮在空中。

发现

我想到了这个方法，并注意到它附加了外部脚本：链接

问题

首先，它不是很平滑，看起来有点断断续续的。其次，正如你所看到的，当图像上下移动时，它看起来像被挤压了一样。我该如何使它平滑移动？或者还有其他方法吗？

- nasty

Answer 1

好的，那么您可以尝试以下操作：

   var baloon = $('#baloon');
   function runIt() {
       baloon.animate({top:'+=20'}, 1000);
       baloon.animate({top:'-=20'}, 1000, runIt);
   }

   runIt();

- Ulan Murzatayev

Answer 2

你也可以使用这个 jQuery 库

http://www.inwebson.com/demo/jqfloat/

- Doua Beri

Answer 3

我建议使用CSS3动画。您可以在此处查看一些示例和教程：http://www.w3schools.com/css3/css3_animations.asp

- Ulan Murzatayev

Answer 4

如果您想要更多支持，而不仅仅是支持CSS3的浏览器，请尝试jQuery的slideUp动画：http://api.jquery.com/slideUp/。

- richardaday