gooodwin67,
<!DOCTYPE html>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.test1 {
position:relative;
}
button {
margin-top: 120px;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(function() {
function abc() {
$('.test1').animate({'left':'100px'},1000).animate({'left':'0'},1000,abc);
}
function abc2() {
$('.test1').animate({'top':'100px'},1000).animate({'top':'0'},1000,abc2);
}
//---------------------------------------------------
$('.but1').click(function(){
$('.test1').stop(true);
abc();
})
$('.but2').click(function(){
$('.test1').stop(true);
abc2();
})
});
</script>
</head>
<body>
<div class = 'test1'>a</div>
<button class = 'but1'>кнопка1</button>
<button class = 'but2'>кнопка2</button>
</body>
</html>