【jQuery】animate使用例（あれをしながらこれをする例）

Tweet

Category JavaScript 2013/03/20

問題

ぷるぷるしながら、左から右に移動したいです。

答え

こんな感じですか。

$('#target').animate(
    {
        marginLeft:600
    },
    {
        duration:3000,
        step:function(now){
            $(this).css('marginTop', Math.sin(now) * 2);
        }
    }
);

上の例では、margin-leftを使ってボックスを移動させている。

そのときに、位置を移動させるのと同時に、margin-topも変化させると、ぷるぷるする。

position:absolute や relative にして、leftを使っても移動は可能。

そのときは、上下の移動にtopを使ってもよい。

それはプルプルしすぎだろうという場合は、ちょっと調整を。