DIV 拖动问题

我想问一下,我的这段拖动div的代码什么地方有问题啊，在ie里面正常,在ff下先拖一下可以，但松开鼠标后再点再拖就不行了,但如果在div中加入文本就可以了，为什么会这样啊?请各位高手指教.<html><head>
<script language="JavaScript" type="text/javascript" src="jquery-1.6.4.js"></script>
<style></style>
</head>
<body><div id="rect" style="width:200px;height:200px;position:absolute;background-color:pink;"></div><div id="display" style="position:absolute;top:300px;"></div>
</body>
</html><script>$(init);function init(){
rectEvent();
}function rectEvent(){
var slider = $("#rect");
var downFlag = false;var offX;slider.mousedown(function(e){
downFlag = true;
var event = getEvent(e);
offX = getOffsetX(event);});slider.mouseup(function(){
downFlag = false;
});slider.mouseout(function(){
downFlag = false;
});slider.mousemove(function(e){
var event = getEvent(e);if(!downFlag){
return false;
}var left = event.clientX - offX;
$("#display").text(left);
slider.css("left",left);
});}
function getEvent(event){
var event = event ? event : window.event;
return event;
}function getOffsetX(event){
var off_X = event.offsetX ? event.offsetX : event.layerX;
return off_X;
}</script>如果我在rect div随便加入文本如：11,这样就可以了，我一直不太明白为什么会这样？