跟着别人学习的一个个拖动层

<script>
        
function objectDrapDrop(obj){
            
var me = this;
            
this.foo = (typeof obj == 'string'? document.getElementById(obj) : obj;
            
this.foo.onmousedown = function(e){
                
var foo = me.foo;
                e 
= e || event;
                
if(e.layerX){
                    foo.oOffset 
= {x:e.layerX, y:e.layerY};
                } 
else {
                    foo.oOffset 
= {x:e.offsetX, y:e.offsetY};
                }
                document.onmousemove 
= me.drag;
                document.onmouseup 
= me.drop;
                document.onselectstart 
= function(){ return false;}
            }
            
this.drag = function(e){
                
var foo = me.foo;
                e 
= e || event;
                foo.style.top 
= e.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - foo.oOffset.y + 'px'
                foo.style.left 
= e.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - foo.oOffset.x + 'px'
            }
            
this.drop = function(e){
                e 
= e || event;
                document.onmousemove 
= document.onmouseup = document.onselectstart = null;
            }
        }
        window.onload 
= function(){
            
var test1 = new objectDrapDrop('foo');
        }
        
</script>
    
</head>
    
<body>
        
<div id="foo">This is a div!</div>
    
</body>

没有多大实际的意思,同样里边的有些东西,没有搞懂。

原文地址:https://www.cnblogs.com/jikey/p/1618772.html