js实现拖拽效果

注！！给移动的元素加上绝对定位

js

//获取移动元素
var odiv=document.querySelector("#moveEle")；
var basex,basey,movex,movey;
odiv.onmousedown=function(e){
	var evt=e||window.event;//浏览器兼容
//初始x y位置
	basex=evt.pageX;
	basey=evt.pageY;

//在整个页面上移动 因此用document或者window 不能再写odiv否则移动不了
	document.onmousemove=function(e){
	var evt=e||window.event;
	movex=evt.pageX-basex;
	basex=evt.pageX;//更改初始位置
	movey=evt.pageY-basey;
	basey=evt.pageY;//更改初始位置

	odiv.style.left=odiv.offsetLeft+movex+"px";
	odiv.style.top=odiv.offsetTop+movey+"px";
	}
document.onmouseup=function(){
//松开鼠标 移动函数失效 否则松开鼠标元素还会继续跟鼠标一起移动
	document.onmousemove=null;
}
}