面板拖动问题
<!doctype HTML>
<html>
<head>
<meta charset="utf-8" />
<title>TEST</title>
<link href="01.css" rel="stylesheet" type="text/css"/>
<script src='01.js'></script>
</head>
<body id='main'>
<div id=dlk>
<p id=dlk_ti>登录</p><input type='button' value='x' id='cancel'>
<div id=inset>
账号<input type="text"/>
<br />
密码<input type="text"/>
</div>
<input type="button" value="登录" id='dlk_btn' >
<ul id="dlk_submenue">
<div id='dlk_now_submenue' class='o1'>我在线上</div>
<li class="dlk_submenue_child o1" id='o1'>我在线上</li>
<li class="dlk_submenue_child o2" id='o2'>Q我吧</li>
<li class="dlk_submenue_child o3" id='o3'>离开</li>
<li class="dlk_submenue_child o4" id='o4'>忙碌</li>
<li class="dlk_submenue_child o5" id='o5'>请勿打扰</li>
<li class="dlk_submenue_child o6" id='o6'>隐身</li>
</ul>
</div>
</body>
</html>
-----------------------------------------------------------------------------
window.onload=dlk_move;
function dlk_move(){
var mtitle=document.getElementById('dlk_ti');
mtitle.onmousedown=dlk_mdown;
}
function dlk_mdown(e){
event=e||window.event
dlk=document.getElementById('dlk');
dlk_x=dlk.offsetLeft
dlk_y=dlk.offsetTop
dlk_cx=event.clientX-dlk_x
dlk_cy=event.clientY-dlk_y
win_w=document.documentElement.clientWidth-dlk.offsetWidth||document.body.clientWidth-dlk.offsetWidth
win_h=document.documentElement.clientHeight-dlk.offsetHeight||document.body.clientHeight-dlk.offsetHeight
document.onmousemove=function(event){
event=event||window.event
dlk.style.left=event.clientX-dlk_cx+"px";
dlk.style.top=event.clientY-dlk_cy+"px";
if(dlk.offsetLeft>win_w){
dlk.style.left=win_w-10+"px"
}else if(dlk.offsetLeft<0){
dlk.style.left='10px';
}
if(dlk.offsetTop>win_h){
dlk.style.top=win_h-10+"px"
}else if(dlk.offsetTop<0){
dlk.style.top='10px';
}
}
document.onmouseup=function(){
document.onmousemove=null;
document.onmouseup=null;
}
}
为什么换一下位置if的限制作用就没了。。。。。。。。。？
为啥
wyx0k1回答
-
arlenhui
不太清楚你的意思，不过改变style.left是会影响offsetLeft的值的
随时随地看视频慕课网APP
Html/CSS
JavaScript