<a class="baslat" href="#">BAŞLAT</a>
<a class="durdur"href="#">DURDUR</a>
<div></div>
div{background:blue; width:150px; height:150px;}
a{display: inline-block; background: #00FF99; padding:20px; border-bottom:4px solid #00CC00; color:#00CC99; text-decoration:none; margin-bottom:20px;}
$(".baslat").click(function(){
  $("div").animate({width: 400}, 2000);
  $("div").animate({height: 400}, 2000);
  $("div").animate({width: 150}, 2000);
  $("div").animate({height: 150}, 2000);
});
$(".durdur").click(function(){
  $("div").clearQueue();
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. //cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js