Javascript internet explorer的可调整大小的块。MouseMove事件的问题

我想制作一个可调整大小的块（

）。当用户抓住块的左上角时，它必须调整大小。这就像是左上角的but，而不是右下角的but

HTML代码：

块的内容

CSS代码：

 .chatBlockBody
 {
    width:240px;
    height:250px;
    border:1px solid #4a73ce;
    position:absolute;
    bottom:25px;
    right:0;
    display:block;
    background-color:White;
  }  
  .topMarker
  {
     position:absolute;
     top:3px;
     left:3px;
  }   

js代码如下：

var dragObject;
$(".topMarker").mousedown(function(e){
   dragObject  = this;
   $(dragObject).parent().css("z-index",42);
   return false;
});

$(document).mouseup(function() {
   dragObject = null;
});

$(document).mousemove(function(event){
   if(dragObject!=null){
       var hg=Math.max($(document).height()-event.pageY,250);
       var wd=Math.max($(document).width()-event.pageX-parseInt($(dragObject).parent().css("right")), 240);
       $(dragObject).parent().css("height",hg+"px");
       $(dragObject).parent().css("width",wd+"px");
   }
});

它适用于Chrome和Firefox。但它在IE中不起作用。 当用户按下鼠标按钮移动鼠标时，IE不执行mousemove代码。所以，它没有重新绘制div的边界

---

如何修复它并为IE创建可调整大小的块？

如果jqueryui.resizeable除了手柄的位置之外都令人满意，您可以在那里使用手柄选项，可以在您想要的每一侧定义手柄：

$（'.chatBlockBody'）。可调整大小（{handles:'nw'}）