<link rel="stylesheet" href="jqueryui/css/redmond/jquery-ui-1.8.9.custom.css"/>
<script src="jqueryui/js/jquery-1.4.4.min.js"></script>
<script src="jqueryui/js/jquery-ui-1.8.9.custom.min.js"></script>

<div id="satu">
</div>

<div id="statusa">Status</div>
<div id="statusb">Status</div>
<div id="statusc">Status</div>

<script>
var a=0,b=0,c=0;

$('#satu').draggable({
    start: function(){
        updateStatusA('Start: '+ a++ +' times')
    },
    drag: function(){
        updateStatusB('Drag: '+ b++ +' Times')

    },
    stop: function(){
        updateStatusC('Stop: '+ c++ +' Times')
    }

});

function updateStatusA(s){
    $('#statusa').text(s).css('text-transform','capitalize');
}
function updateStatusB(s){
    $('#statusb').text(s).css('text-transform','capitalize');
}
function updateStatusC(s){
    $('#statusc').text(s).css('text-transform','capitalize');
}
 
</script>

<style>
#satu { border: 1px solid #aaa; width: 100px; height: 100px; cursor: move; background: yellowgreen; }
#start { background: blue; }
#drag { background: black; }
#stop { background: red }
</style>