Question

$('.balloon').animate({top:30} ,1000);
$('.balloon').animate({top:10} ,1000);

我可以成功完成上述工作。 Plz看看complete code and execution at fiddle

但我想在上面使用通用顶级位置，如下所示。但是当我这样做时，我会给出错误TypeError: a.ownerDocument is undefined

$('.balloon').animate({top:$(this).css('top')+20} ,1000);
$('.balloon').animate({top:$(this).css('top')-20} ,1000);

Answer 1

您的代码可以简化：

$(document).ready(function() {
    (function foo () {
        $('.balloon').stop(true).animate({top: "+=30"}, 1000, function () {
            $(this).stop(true).animate({top: "-=30"}, 1000, foo);
        });
    })();
});

您可以使用+=30将30px添加到顶部位置。与-30px相同。

JSFIDDLE

Answer 2

您需要使用$.each jquery函数

这是示例http://fiddle.jshell.net/cRs9f/1/

$(document).ready(function()
{
    var downs = true;
    setInterval (function()
    {

        $('.balloon').each(function(){

          if(downs)
          {

               $(this).animate({top:30} ,1000);
               $(this).animate({top:$(this).css('top')+20} ,1000);
                downs =false;

          }else
          {
            $(this).animate({top:10} ,1000);
            $(this).animate({top:$(this).css('top')-20} ,1000);
            downs =true;
          }


        });

    },1000);
});

在动画函数中使用$（this）

2 个答案: