用js拖拽div-蒲公英云

用js拖拽div

描述：
拖拽div元素，主要用到以下三个事件
onmousedown
onmousemove
onmouseup
当拖拽网页中的内容时，浏览器会默认搜索引擎进行搜索，
如果取消该行为，可返回return false,但IE8不行
setCapture();可对事件进行捕获，当调用该方法是，该元素会把下一次的所有相关事件都揽在自身上,该方法只在IE中执行
js代码：

<script type="text/javascript">
        window.onload = function(){
            /*拖拽div元素
             onmousedown
             onmousemove
             onmouseup
             * */
            var box12 = document.getElementById("box12");
            drag(box12);
 function drag(obj){
            obj.onmousedown = function(event){
                if(obj.setCapture){
                    obj.setCapture();
                }
                //obj.setCapture &&  obj.setCapture();
                event = event || window.event;
                var x = event.clientX-obj.offsetLeft;
                var y = event.clientY- obj.offsetTop;
            var sl = document.body.scrollLeft || document.documentElement.scrollLeft;
            var st = document.body.scrollTop || document.documentElement.scrollTop;
            document.onmousemove=function(event){
                event = event || window.event;
                var left = event.clientX;
                var top = event.clientY;
                obj.style.left = left-x+sl+"px";
                obj.style.top = top-y+st+"px";
            };
            document.onmouseup=function(){
                document.onmousemove = null;
                document.onmouseup = null;
                //鼠标松开时取消捕获
                obj.releaseCapture && obj.releaseCapture();
            };
            /*
             当拖拽网页中的内容时，浏览器会默认搜索引擎进行搜索，
             如果取消该行为，可返回return false,但IE8不行
             setCapture();可对事件进行捕获，当调用该方法是，该元素会把下一次
             的所有相关事件都揽在自身上,该方法只在IE中执行
             * */
            return false;
            };
        };
        }
    </script>