Corian,
так?
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
#main {
z-index: 2;
width: 32px;
height: 32px;
position: absolute;
top: 240px;
left: 240px;
background-color: #222222;
}
#anim_item1 {
z-index: 1;
background-color: red;
width: 28px;
height: 28px;
position: absolute;
top: 242px;
left: 242px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script>
$(function() {
var a = 1;
$("#main").click(function() {
a ^= 1;
$("#anim_item1").animate([{
top: 128,
left: 192
}, {
top: 242,
left: 242
}][a], 750, ["easeInQuad", "easeOutQuad"][a]);
});
});
</script>
</head>
<body>
<div id="main"></div>
<div id="anim_item1"></div>
</body>
</html>