Demo of animation with callback function using JQuery





CSS

<style>
#d1 { position: relative; }
</style>

HTML

<input type=button id=b1 value='Animate'>
<img id='d1' src='pt.gif'>
<br><br>
<div id='d2'></div>

jquery

<script>
$(document).ready(function() {
$('#b1').click(function(){
start_move();
function start_move(){
var x=$("#d1").position();
$('#d2').html(x.left);
//$( window ).width()
if(x.left< 400){
$("#d1").animate({left: "+=10px"},'fast',start_move);
}
else{
$("#d1").offset({  left: 100})
$("#d1").animate({left: "+=10px"},'fast',start_move);
}
}
})
})
</script>