1.js控制
var msgTitle=document.createElement("div");
msgTitle.onmousedown=function(e){
var ev1=e||window.event;
//获取元素的外边距
var left=msgBox.offsetLeft;
var top=msgBox.offsetTop;
//获取鼠标的坐标
var x=ev1.clientX;
var y=ev1.clientY;
var x3=x-left;
var y3=y-top;
//鼠标移动的时候
document.onmousemove=function(e){
var ev2=e||window.event;
//获取鼠标移动后的坐标
var x2=ev2.clientX;
var y2=ev2.clientY;
//计算元素新的坐标
var newleft=x2-x3;
var newtop=y2-y3;
//限制边界
if(newleft<=0){newleft=-(msgBox.offsetWidth*0)}
if(newtop<=0){newtop=0};
msgBox.style.left=newleft+"px";
msgBox.style.top=newtop+"px";
};
document.onmouseup=function(){
document.onmousemove=null;
document.onmouseup=null;
}
}
2.jQuery控制
var loginTitle=$("<div></div>");
//窗体移动事件
loginTitle.mousedown(function(e){
var ev=e||window.event;
//获取元素的边距
var loginX=login.offset().left;
var loginY=login.offset().top;
//获取鼠标点击时的坐标
var monseX=ev.clientX;
var monseY=ev.clientY;
//计算元素坐标与鼠标坐标的差值
var chaX=parseFloat(monseX)-parseFloat(loginX);
var chaY=parseFloat(monseY)-parseFloat(loginY);
document.onmousemove=function(e){
var ev2=e||window.event;
//获取鼠标移动后的坐标
var x2=ev2.clientX;
var y2=ev2.clientY;
//计算元素新的坐标
var newleft=x2-chaX;
var newtop=y2-chaY;
//限制边界
if(newleft<=0){newleft=0}
if(newtop<=0){newtop=0};
login.css({"top":newtop+"px","left":newleft+"px"});
};
document.onmouseup=function(){
document.onmousemove=null;
document.onmouseup=null;
}
});