animate object jqeury

by victorxpp

HTML

<div class="container">
  <div class="target"></div>
  <div class="object"></div>
  <button>MOVE</button>
</div>

CSS

.container{
  width: 120px;
  height: 150px;
  text-align: center;
}

.target{
  margin: 0 auto;
  width: 100px;
  height: 100px;
  background-color: #DDD;
  margin-bottom: 100px;
}

.object{
  margin: 0 auto;
  width: 50px;
  height: 50px;
  background-color: brown;
}
button{
  margin-top:20px;
}

JavaScript

$('button').click(function(){
   var offset = $('.target').offset();
  // var object = $('.object');
  $('.object').css("position","absolute").animate({
  "top":offset.top,
  "left":offset.left
  })
  //  object.offset({top: offset.top, left: offset.left});
});