jQuery Animate onClick

by Dylan Schadeck

HTML

<div id="block"></div>
<button id="go">&raquo; Run</button>

CSS

div { width: 20px; height: 20px; background: green; margin: 10px; }

JavaScript

$("#go").click(function(){
  var dest = parseInt($("#block").css("margin-left").replace("px", "")) + 100;
    if (dest > 500) {
        $("#block").animate({
            marginLeft: "10px"
          }, 500 );
    }
    else {
      $("#block").animate({
        marginLeft: dest + "px"
      }, 500 );
    }
});