captureEvents 拖放详解编程语言

<html> 
<head> 
<title> Drag Demo 1 </title> 
<style type="text/css"> 
<!-- 
#drag{ 
    width:100px; 
    height:20px; 
    background-color:#eee; 
    border:1px solid #333; 
    position:absolute; 
    top:30px; 
    left:200px; 
    text-align:center; 
    cursor:default; 
    } 
//--> 
</style> 
<script type="text/javascript"> 
<!-- 
window.onload=function(){ 
    drag(document.getElementById('drag')); 
}; 
 
function drag(o){ 
    o.onmousedown=function(a){ 
        var d=document;if(!a)a=window.event; 
        var x=a.layerX?a.layerX:a.offsetX,y=a.layerY?a.layerY:a.offsetY; 
        if(o.setCapture) 
            o.setCapture(); 
        else if(window.captureEvents) 
            window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP); 
 
        d.onmousemove=function(a){ 
            if(!a)a=window.event; 
            if(!a.pageX)a.pageX=a.clientX; 
            if(!a.pageY)a.pageY=a.clientY; 
            var tx=a.pageX-x,ty=a.pageY-y; 
            o.style.left=tx; 
            o.style.top=ty; 
        }; 
 
        d.onmouseup=function(){ 
            if(o.releaseCapture) 
                o.releaseCapture(); 
            else if(window.captureEvents) 
                window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP); 
            d.onmousemove=null; 
            d.onmouseup=null; 
        }; 
    }; 
} 
//--> 
</script> 
</head> 
 
<body> 
<div id="drag">drag me<div> 
</body> 
</html> 
<html> 
<head> 
<title> Drag Demo 1 </title> 
<style type="text/css"> 
<!-- 
#drag{ 
    width:100px; 
    height:20px; 
    background-color:#eee; 
    border:1px solid #333; 
    position:absolute; 
    top:30px; 
    left:200px; 
    text-align:center; 
    cursor:default; 
    } 
//--> 
</style> 
<script type="text/javascript"> 
<!-- 
window.onload=function(){ 
    drag(document.getElementById('drag')); 
}; 
 
function drag(o){ 
    o.onmousedown=function(a){ 
        var d=document;if(!a)a=window.event; 
        var x=a.layerX?a.layerX:a.offsetX; 
        var y=a.layerY?a.layerY:a.offsetY; 
 
        d.onmousemove=function(a){ 
            if(!a)a=window.event; 
            if(!a.pageX)a.pageX=a.clientX; 
            if(!a.pageY)a.pageY=a.clientY; 
            var tx=a.pageX-x,ty=a.pageY-y; 
            o.style.left=tx; 
            o.style.top=ty; 
        }; 
 
        d.onmouseup=function(){ 
            if(o.releaseCapture) { 
                o.releaseCapture(); 
            } else if(window.captureEvents) { 
                window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP); 
            } 
            d.onmousemove=null; 
            d.onmouseup=null; 
        }; 
    }; 
} 
//--> 
</script> 
</head> 
 
<body> 
<div id="drag">drag me<div> 
</body> 
</html>

 

原创文章,作者:奋斗,如若转载,请注明出处:https://blog.ytso.com/industrynews/13293.html

(0)
上一篇 2021年7月19日 15:39
下一篇 2021年7月19日 15:39

相关推荐

发表回复

登录后才能评论