[jQuery] trying to get a less choppy drag action (code inside)

[jQuery] trying to get a less choppy drag action (code inside)


I'm happy with my draggable box but its choppy. ANyone know of a
strategy to get the box to not lag so much when mouse is moved
quickly? If you grab towards the left/right edge, the box ends up
moving out of the mouse position, cancelling the drag handler...
This is my code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/
TR/html4/strict.dtd">
<html>
<head>
<script type="text/javascript" src="jquery-1.2.6.js"></script>
<script type="text/javascript">
$(function(){
    $('#handle').bind("mousedown", function(e){
            $Tgap = e.pageY - $(this).parent().position().top;
            $Lgap = e.pageX - $(this).parent().position().left;
        $(this).bind("mousemove", function(e){
            $(this).parent().css({
                top: (e.pageY - $Tgap) +'px',
                left: (e.pageX - $Lgap) +'px'
            });
            return false;
            });
    });
    $('#handle').bind("mouseup", function(){
        $(this).unbind("mousemove");
    });
});
</script>
<style type="text/css">
#dragger {
border:1px solid;
width:200px;
height:200px;
position:absolute;
z-index:99;
}
#handle {
background: #a9a;
width:190px;
height:20px;
cursor:move;
}
</style>
</head>
<body>
<div id="dragger">
<div id="handle">=================</div>
    dfg dfg dfg
</div>
</body>
</html>