mouse_javascript 기술로 드래그할 수 있는 DIV 구현 아이디어 및 코드

复代码 代码如下:

<스크립트 언어='javascript' type='text/javascript'>
var offset_x;
var offset_y;
function Milan_StartMove(oEvent)
{
var whichButton;
if(document.all&&oEvent.button==1) whichButton=true;
else { if(oEvent.button==0)whichButton=true;}
if(whichButton)
{
var oDiv=document.getElementById("oDiv");
offset_x=parseInt(oEvent.clientX-oDiv.offsetLeft);
offset_y=parseInt(oEvent.clientY-oDiv.offsetTop);
document.documentElement.onmousemove=function(mEvent)
{
var eEvent;
if(document.all) eEvent=이벤트;
else{eEvent=mEvent;}
var oDiv=document.getElementById("oDiv");
var x=eEvent.clientX-offset_x;
var y=eEvent.clientY-offset_y;
oDiv.style.left=(x) "px";
oDiv.style.top=(y) "px";
}
}
}
function Milan_StopMove(oEvent){document.documentElement.onmousemove=null; }


<본문>

style="cursor:move;position:absolute;width:100px;height: 60px;border:1px solid

silver;left:100px;top:100px;z-index:9999;">

document.all[]是文档中所有标签组成成的一个数组变weight,包括了文档对象中所有元素;
event.button적值：0没按键 1按左键 2按右键 3按左와 右键 4按中间键 5按左와 中间键 6按右와 中间键 7按所有键

下면对此代码进行改进，模창문 并且让它可以盖住

复代码 代码如下:

을 선택하세요.

<머리>

<스크립트 언어='javascript' type='text/javascript'>
var offset_x;
var offset_y;
function Milan_StartMove(oEvent,div_id)
{
var whichButton;
if(document.all&&oEvent.button==1) whichButton=true;
else { if(oEvent.button==0)whichButton=true;}
if(whichButton)
{
var oDiv=div_id;
offset_x=parseInt(oEvent.clientX-oDiv.offsetLeft);
offset_y=parseInt(oEvent.clientY-oDiv.offsetTop);
document.documentElement.onmousemove=function(mEvent)
{
var eEvent;
if(document.all) eEvent=이벤트;
else{eEvent=mEvent;}
var oDiv=div_id;
var x=eEvent.clientX-offset_x;
var y=eEvent.clientY-offset_y;
oDiv.style.left=(x) "px";
oDiv.style.top=(y) "px";
var d_oDiv=document.getElementById("disable_" oDiv.id);
d_oDiv.style.left=(x) "px";
d_oDiv.style.top=(y) "px";
}
}
}
function Milan_StopMove(oEvent){document.documentElement.onmousemove=null; }
함수 div_Close(o)
{var oDiv=o; oDiv.style.display="none";var d_oDiv=document.getElementById("disable_" o.id);d_oDiv.style.display="none";}


<본문>

style="cursor:move;width:100%;height:15px; 배경색:#0066cc; 글꼴 크기:10px;">

X

测试一下

3333
1111
222

이 div에서는 더 많은 것을 사용할 수 없나요?换成parentNode,调整了CSS样式，这样在FF下也能正常运行了。

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.