 $(".top").hover(
 function() {
 $(this).stop().animate({"top": "-75px"}, "400");
 },
 function() {
 $(this).stop().animate({"top": "-50px"}, "400");
 });
 
 $(".right").hover(
 function() {
 $(this).stop().animate({"left": "35px"}, "400");
 },
 function() {
 $(this).stop().animate({"left": "10px"}, "400");
 });

 $(".down").hover(
 function() {
 $(this).stop().animate({"top": "-25px"}, "400");
 },
 function() {
 $(this).stop().animate({"top": "-50px"}, "400");
 });

Setting Validate Copy Format

body{
  background:#ffffef;
}


.box {
  background:#fff;
  width:40px;
  height:40px;
  border:solid 1px gray;
  position:relative;
  left:10px;
  top:-50px;
  display:inline-block;
}
.bottom-box {
  background:gray;
  width:60px;
  height:10px;
  border-radius:20px;
  opacity:0.5;
  display:inline-block;
}

Setting Validate Copy Format

<div style="height:50px;"></div>
  
<div>
<div class="bottom-box"></div>
<div class="bottom-box"></div>
<div class="bottom-box"></div>
</div>  
<div>
<div class="down box"></div>
<div style="margin-left:18px" class="top box"></div>
<div style="margin-left:18px" class="right box"></div>
</div>

Copy Format

Download