1.拖拽的外掛很多，其實我們只要明白他的原理，就不難了：

之所以形成拖拽的效果，是在滑鼠按下onmousedown的時候記錄滑鼠座標與被拖拽div左邊界，上邊界的距離disX，disY，在拖動onmousemove的時候，講拖動時滑鼠的x座標oEv.clientX-disX;得到的這個值應該是拖動情況下，div的left；同理，投票也是：

2.js程式碼：

var oBox=document.getElementById('box');
	var oPut=oBox.getElementsByTagName('input')[0];
	
	 oBox.onmousedown=function(ev){
		 oEv=ev || window.event;
		 var disX=oEv.clientX-oBox.offsetLeft;
		 var disY=oEv.clientY-oBox.offsetTop;
		 
		document.onmousemove=function(ev){
			oEv=ev || window.event;
			//console.log(oEv.clientX,oEv.clientY)
			var w=oEv.clientX-disX;
			var h=oEv.clientY-disY;
			oBox.style.left=w+"px";
			oBox.style.top=h+"px";
			
			if(w>document.documentElement.clientWidth-oBox.offsetWidth){
				oBox.style.left=document.documentElement.clientWidth-oBox.offsetWidth+'px';
			};
			if(w<0){
				oBox.style.left="0";
			};
			if(h>document.documentElement.clientHeight-oBox.offsetHeight){
				oBox.style.top=document.documentElement.clientHeight-oBox.offsetHeight+'px';
			};
			if(h<0){
				oBox.style.top="0";
			};
		};
		 oBox.onmouseup=function(){
			 document.onmousemove=null;
		};
	};
	//---------------------------	
	oPut.onmousedown=function(ev){
		oEv=ev || window.event;
		oEv.cancelBubble=true;
	};
 

<div id="box">
<input type="text">

*{margin:0;padding:0;}
#box{width:200px;height:200px;background:#ccc;position:absolute;}