javascript鼠标拖拽的那些事情

<html>
<head>
<title>javascript鼠标拖拽的那些事情</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<script type="text/javascript"><!--     
       var dragging = false;     
       var test;     
       var mouseY;     
       var mouseX;     
       //初始化
       window.onload = function(){     
        test = document.getElementById("test");  
        //绑定拖拽元素   
        test.onmousedown = down;     
        //鼠标在元素内按下触发down事件
        test.onmousemove = move;  
        //鼠标在元素内移动触发move事件   
        document.onmouseup = up;  
        //鼠标松开触发up事件     
        test.style.position = "relative";     
        test.style.top = "0px";     
        test.style.left = "0px";     
        //定义css
       }     
       function down(event)     
       {     
        event = event || window.event;      
        dragging = true;      
        mouseX = parseInt(event.clientX);     
        mouseY = parseInt(event.clientY);     
        objY = parseInt(test.style.top);     
        objX = parseInt(test.style.left);     
       }     
       function move(event){     
        event = event || window.event;      
        if(dragging == true){     
            var x,y;     
            y = event.clientY - mouseY + objY;     
            x = event.clientX - mouseX + objX;     
            test.style.top = y + "px";     
            test.style.left = x + "px";     
        }     
       }     
       function up(){     
        dragging = false;     
       }     
       // -->
       </script> 
<div id="test" style="border:1px solid ccc; color:#fff; width:200px; background:#000; padding:10px;">
  <p>一点点白</p>
</div>
</body>
</html>