                        課程
                    
                        /前端開(kāi)發(fā)
                        
                            /JavaScript
                        
                        /DOM事件探秘

不能左右拖動(dòng)

代碼如下：

index.html

<!DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html?xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta?http-equiv="Content-Type"?content="text/html;?charset=utf-8"?/>
<title>無(wú)標(biāo)題文檔</title>
<link?type="text/css"?rel="stylesheet"?href="style.css"?/>
<script?type="text/javascript"?src="script.js"></script>
</head>

<body>
<div?id="loginpanel">
	<div?id="login_logo_webqq"></div>
????<div?class="inputs">
????	<div>
????????	<span>賬????號(hào)：</span>
????????????<input?type="text"?value="QQ賬號(hào)"?/>
????????</div>
????????<div>
????????	<span>密????碼：</span>
????????????<input?type="text"?/>
????????</div>
????</div>
????<div?id="bottomdv">
????	<div?id="btn"></div>
????????<div?id="loginstate">
????????	<div?id="loginstateshow"?class="state_show?online"></div>
????????????<div?id="state_down"></div>
????????????<div?id="login_state">我在線上</div>???????????
????????</div>
????</div>
</div>
</body>
</html>

樣式style.css

/*?CSS?Document?*/
*{?margin:0?auto;?padding:0;}
#loginpanel{?left:400px;
			?top:120px;?
			?width:380px;?
			?height:247px;
			?border-radius:10px;
			?border:1px?solid?#ccc;
			?position:absolute;
			?background:#f6f6f6;
			?box-shadow:0?0?8px?#000;
			?position:absolute;}
#login_logo_webqq{?width:200px;
					height:44px;
					margin-left:100px;
					margin-top:10px;
					background:url(image/login_window_logo.png)?-210px;
					cursor:move;}
.inputs{margin-left:80px;
????????margin-top:30px;
		margin-bottom:20px;
		font:bold?15px?arial;}
.inputs?div{?margin-top:20px;}
.inputs?input{?width:170px;
				border-radius:10px;
				border:1px?solid?#ccc;
				height:23px;
				font-size:16px;}
#bottomdv{?margin-left:70px;}
#btn{?background:url(image/login_btn.png)?-111px?0;
	??width:111px;
	??height:36px;
	??float:left;
	??margin-left:14px;
	??cursor:pointer;}
#loginstate{?cursor:pointer;
			?float:left;
			?width:120px;
			?height:16px;
			?margin-top:10px;
			?margin-left:20px;}
#loginstateshow{?float:left;				
				height:14px;
				width:14px;}
#online{background:url(image/ptlogin.png)?0?0;}
#state_down{?background:url(image/ptlogin.png)?0?-22px;
			float:left;
			height:6px;
			width:7px;
			margin:5px?5px?0?7px;}
#login_state{?font-size:12px;}

js文件

//?JavaScript?Document

window.onload=drag;
function?drag(){
	var?otitle=document.getElementById("login_logo_webqq");
	otitle.onmousedown=fndown;
}
function?fndown(e){
	e=e?||?window.event;
	var?opt=document.getElementById("loginpanel"),
		disx=e.clientX-opt.offsetLeft,
		disy=e.clientY-opt.offsetTop;
	document.onmousemove=function?(e){
		e=e?||?window.event;
		fnmove(e,disx,disy);
	}	
}
function?fnmove(e,posx,posy){
	e=e?||?window.event;
	var?opt=document.getElementById("loginpanel"),
		l=e.clinetX-posx,
		t=e.clientY-posy;
	opt.style.left=l+"px";
	opt.style.top=t+"px";
}

可以上下拖動(dòng)，為什么左右不能拖動(dòng)？求解啊