<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>函数版拖动层</title>
<style>
body{FONT-SIZE: 16px; BACKGROUND: #fff; text-align:left}
#div1,#div2 {background:yellow;position:absolute;border:1px solid red; width:100px;font-size:13px;height:100px;
width:100px;text-align:left;cursor:move;
}
#div2 {background:#33FFCC;}
</style>
<script>
function drag(e, el){
coglass=el
mydiv=el,x = 0, y = 0;
do { x += mydiv.offsetLeft, y += mydiv.offsetTop; } while (mydiv = mydiv.offsetParent);
juX=e.clientX+document.documentElement.scrollLeft-x; //juX触发点到层左上定点横项距离
juY=e.clientY+document.documentElement.scrollTop-y ; //juY触发点到层左上定点竖项距离
document.onmousemove =dragstart;
document.onmouseup = dragstop; tuodong=1
}function dragstart(evt){
if (tuodong==0) return false;
e=window.event||evt window.getSelection && window.getSelection().removeAllRanges(); if (coglass.setCapture) coglass.setCapture();
leftx=e.clientX+document.documentElement.scrollLeft-juX;
topy=e.clientY+document.documentElement.scrollTop-juY ; if (e.clientX>1 && e.clientX<=document.documentElement.clientWidth) coglass.style.left = leftx+"px";
if (e.clientY>1 && e.clientY<=document.documentElement.clientHeight) coglass.style.top = topy+"px";
}function dragstop(){
tuodong=0;
if (coglass.releaseCapture) coglass.releaseCapture();}
</script>
</head>
<body>
拖动层实例:
<div id="div1" onmousedown="drag(event,this)">拖动层1</div>
<div id="div2" onmousedown="drag(event,this)">拖动层2</div></body>
</html>-----------------------------------------------------------------------------------------
现在想问一下:dragstart函数中用到的juX 是从drag中得到的,但我又无法传递这个参数
所以juX我弄成了全局函数,我想问一下有没有传递参数的方法可以从drag函数中得到这个juX
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>函数版拖动层</title>
<style>
body{FONT-SIZE: 16px; BACKGROUND: #fff; text-align:left}
#div1,#div2 {background:yellow;position:absolute;border:1px solid red; width:100px;font-size:13px;height:100px;
width:100px;text-align:left;cursor:move;
}
#div2 {background:#33FFCC;}
</style>
<script>
function drag(e, el){
coglass=el
mydiv=el,x = 0, y = 0;
do { x += mydiv.offsetLeft, y += mydiv.offsetTop; } while (mydiv = mydiv.offsetParent);
juX=e.clientX+document.documentElement.scrollLeft-x; //juX触发点到层左上定点横项距离
juY=e.clientY+document.documentElement.scrollTop-y ; //juY触发点到层左上定点竖项距离
document.onmousemove =dragstart;
document.onmouseup = dragstop; tuodong=1
}function dragstart(evt){
if (tuodong==0) return false;
e=window.event||evt window.getSelection && window.getSelection().removeAllRanges(); if (coglass.setCapture) coglass.setCapture();
leftx=e.clientX+document.documentElement.scrollLeft-juX;
topy=e.clientY+document.documentElement.scrollTop-juY ; if (e.clientX>1 && e.clientX<=document.documentElement.clientWidth) coglass.style.left = leftx+"px";
if (e.clientY>1 && e.clientY<=document.documentElement.clientHeight) coglass.style.top = topy+"px";
}function dragstop(){
tuodong=0;
if (coglass.releaseCapture) coglass.releaseCapture();}
</script>
</head>
<body>
拖动层实例:
<div id="div1" onmousedown="drag(event,this)">拖动层1</div>
<div id="div2" onmousedown="drag(event,this)">拖动层2</div></body>
</html>-----------------------------------------------------------------------------------------
现在想问一下:dragstart函数中用到的juX 是从drag中得到的,但我又无法传递这个参数
所以juX我弄成了全局函数,我想问一下有没有传递参数的方法可以从drag函数中得到这个juX
可以这样