zoukankan html css js c++ java

js_简练高效拖拽工作中可直接引用扩展

<!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="content-type" charset="utf-8" />
    <meta http-equiv="content-type" content="text/html" />
    <title>demo</title>
</head>
<body>
<p>aaaaaaaaaaa</p>
<div id="one" style="height:100px;100px;background:red;position:absolute;"></div>

<script>
var odiv=document.getElementById("one");
dra(odiv);
function dra(obj){
    obj.onmousedown=function(e){
        var oe=e||window.event;
        var $this=this;
        var l=oe.clientX-$this.offsetLeft;
        var t=oe.clientY-$this.offsetTop;   
        document.onmousemove=function(e){    
            var oe=e||window.event;
            var ol=oe.clientX-l;
            var ot=oe.clientY-t;
            if(ol<0) ol=0;
            if(ot<0) ot=0;
            if(ot>document.documentElement.clientHeight-$this.offsetHeight) ot=document.documentElement.clientHeight-$this.offsetHeight;
            if(ol>document.documentElement.clientWidth-$this.offsetWidth) ol=document.documentElement.clientWidth-$this.offsetWidth;
            $this.style.left=ol+"px";
            $this.style.top=ot+"px"; 
        }
        document.onmouseup=function(){
            document.onmousemove=null;
            document.onmouseup=null;
            if($this.releaseCapture) $this.releaseCapture(); 
        }
        if($this.setCapture){
            $this.setCapture();
        }
        if(oe.preventDefault) oe.preventDefault();
        else oe.returnValue=false;
        return false;
    }
}
</script>
</body>
</html>

查看全文

相关阅读:
第四章
 第三章
 第二章
 实验5-2: 编制程序，输入m、n（m≥n≥0）后，计算下列表达式的值并输出。要求将计算阶乘的运算编写作函数fact(n)，函数返回值的类型为float
作业
 多人电费
 单人电费
 圆柱体积
 圆面积
 第七章

原文地址：https://www.cnblogs.com/hcjs/p/2653730.html

js_简练__高效拖拽__工作中可直接引用扩展

js_简练高效拖拽工作中可直接引用扩展