jquery - jquery を使用して、ループ アニメーションで画像を上下にバウンスさせる

Question

私はjqueryを初めて使用し、開発中のWebサイトでジャンプする城（上下の動き）で跳ねる子供の効果を作成したいと考えています。

以下は、サイトの非常に簡略化された構造です。彼女がジャンプする城の上にいるかのように、彼女を上下に動かすにはどうすればよいですか?

画像の ID はballerinaです。

http://www.staging.alexanderdzine.com.au/jquery-test/

Answer 1

このコードを使用...

var int=self.setInterval(function(){bounceIMG()},500);

function bounceIMG(){
   if($("#ballerina-wrapper").css('margin-top') == '0px'){
      $("#ballerina-wrapper").animate({
         marginTop: "30px"
      }, 150 );
   }    else {
      $("#ballerina-wrapper").animate({
         marginTop: "0px"
      }, 150 );
    }
}

またはjquery uiバウンス効果を使用してください...