jQuery 动画对象看起来像漂浮在水中

Question

所以我是 jQuery 的新手，我正在尝试制作漂浮在水中的冰山的连续动画。

这是水面上的冰山..

我想让它有点旋转和摆动，这是我当前的循环动画代码。只需要一些帮助让它做我想做的事哈!

function iceburg() {
    jQuery('.iceburg').css({bottom:0});
    jQuery('.iceburg').animate ({
        bottom: '10px'
    }, 200, function() {
        jQuery('.iceburg').animate ({
            bottom: '0px'
        }, 200);
    });
}
iceburg();

我不知道我做错了什么以及如何旋转它？有人可以帮忙吗？

Answer 1

尝试

var ice = $('.iceburg');

function anim() {
    setInterval(function(){
        ice.animate({
            top:'+=20'},
          { 
            duration:1000,
            step:function()
                  { ice.css('-webkit-transform','rotate(-0.5deg)');}
                });

       ice.animate({
              top:'-=20'},
             { 
               duration:1000,
               step:function()
                  { ice.css('-webkit-transform','rotate(0.5deg)');}
                });
         });
   }

   anim();

fiddle http://jsfiddle.net/code_snips/dkFqQ/