window.onload=darg;
function?darg(){
????var?oTitle=document.getElementById('login_logo');
????var?oclose=document.getElementById('Close');
????var?btn=document.getElementById('btn');
????oclose.onclick=fnClick;
????oTitle.onmousedown=fnDown;
}
function?fnDown(event){
????????var?oDrag=document.getElementById('loginpanel');
????????//光標(biāo)按下時(shí)光標(biāo)與面板之間的距離
????????e?=?event||window.event;
????????disX=e.clientX-oDrag.offsetLeft;
????????disY=e.clientY-oDrag.offsetTop;
????????//移動(dòng)
????????document.onmousemove=function()?{
????????fnMove(event,disX,disY);
????????}
????????//釋放鼠標(biāo)
????????document.onmouseup=function()?{
????????????document.onmousemove=null;
????????????document.onmouseup=null;
????????}
????????//光標(biāo)位置有問題
????????/*document.title=event.clientX+','+event.clientY;
????????oDrag.style.left=event.clientX+'px';
????????oDrag.style.top=event.clientY+'px';*/
}
function?fnMove(e,posX,posY)?{
?????e=?event?||?window.event;
????var?oDrag=document.getElementById('loginpanel');
????l=e.clientX-posX;
????t=e.clientY-posY;
??????winW=document.documentElement.clientWidth;
??????winH=document.documentElement.clientHeight;
??????maxW=winW-oDrag.offsetWidth-10,//防止按鈕溢出
??????maxH=winH-oDrag.offsetHeight;
??if(l<0){
????l=0;
??}else?if(l>maxW){
????l=maxW;
??}
??if(t<0){
????t=10;//防止按鈕溢出
??}else?if(t>maxH){
????t=maxH;
??}
????oDrag.style.left=l+'px';
????oDrag.style.top=t+'px';
}
function?fnClick(){
????var?oDrag=document.getElementById('loginpanel');
????oDrag.style.display='none';
}<!DOCTYPE?html>
<html>
<head>
????<meta?charset="UTF-8">
????<link?rel="stylesheet"?type="text/css"?href="css/login.css">
????<script?src="js/login.js"></script>
????<title>登錄聊天室</title>
</head>
<body>
<form?name="login"?action="login.jsp"?method="post">
????<div?id="loginpanel">
????????<div?id="_exit">
????????????<div?id="Close">
????????????</div>
????????</div>
????????<div?id="login_logo"></div>
????????<div?id="inputs">
????????????<div>
????????????????<span>賬號(hào):</span>
????????????????<span>
????????????????<input?id="user"?type="text"?value="">
????????????????</input>
????????????????</span>
????????????</div>
????????????<div>
????????????????<span>密碼:</span>
????????????????<span>
????????????????????<input?id="pwd"?type="password"></input>
????????????????</span>
????????????</div>
????????</div>
????????<div?id="btn"><input?type="submit"?value="登錄"></input></div>
????????<div?id="msg"></div>
????</div>
</form>
</body>
</html>chrome可以拖動(dòng)，F(xiàn)irefox無法拖動(dòng)，不要求IE兼容，請(qǐng)問為什么啊?
模仿慕課網(wǎng)上QQ拖拽效果，chrom有效果，但是Firefox不兼容。提示event is not defined。不知道為什么。
遷就LOSE
2016-04-27 11:38:24