关于函数执行的对象的问题？

Question

function fnDown(event){

  event = event || window.event;

  var oDrag=document.getElementById('loginPanel'),

      // 光标按下时光标和面板之间的距离

      disX=event.clientX-oDrag.offsetLeft,

      disY=event.clientY-oDrag.offsetTop;

  // 移动

  document.onmousemove=function(event){

  event = event || window.event;

  fnMove(event,disX,disY);

  }

  // 释放鼠标

  document.onmouseup=function(){

  document.onmousemove=null;

  document.onmouseup=null;

  }

}

在这个函数在不管是onmousemove还是onmouseup它执行的对象都是document。那么这个document具体是指什么呢？

如果我想要把这个名为loginPanel的div放在更大的div2里面？那么这个qq面板在移动过程中的范围会不会减小？如果不会，我想实现qq面板在更小的范围里面可以拖动应该怎么设置？

Answer 1

1.document是整个文档、这个是为了防止拖动太快元素跟不上鼠标和有其他元素存在产生BUG2.不会减小，拖拽过程中判断位置，超出范围就强制拉回来