javascript - Change CSS on every click of a button with JavaScript

Question

I want to increase the right margin of .questionarea by 400px every time a user clicks on .go. Here's my Javascript.

            var marright = "-400px"
        $(".go").click(function(){
          $(".questionarea").animate({
            marginRight: marright
          }, 300 );
         marright += "-400px";
        });

If you take out the second last line, the button works once but I've got no idea of the syntax for increasing the size of the margin on each additional click.

Answer 1

これを試して：

var marright = -400;
$(".go").click(function(){
    $(".questionarea").animate({
        marginRight: marright
    }, 300, function(){
        marright += -400;
    });
});

末尾に がmarrightある文字列として持つ必要はありません。pxJquery はそれを解決するのに十分賢いです。

Answer 2

    $(".go").click(function(){
      $(".questionarea").animate({
        marginRight: "-=400"
      }, 300 );
    });

こうあるべきだと思います。