完璧に引っ張る
1601 ワード
htmlコード:
cssコード:
JAvascriptコード:
<div id="div1"></div>
cssコード:
#div1{width:100px;height:100px;background:red;position:absolute}
JAvascriptコード:
window.onload=function(){
var oDiv=document.getElementById("div1");
var x=0;
var y=0;
oDiv.onmousedown=function(ev){
var oEvent=ev||event;
// div offsetLeft
x=oEvent.clientX-oDiv.offsetLeft;
// div offsetTop
y=oEvent.clientY-oDiv.offsetTop;
document.onmousemove=function(ev){
var oEvent=ev||event;
var left=oEvent.clientX-x;
var right=oEvent.clientY-y;
//
if(left<0){
left=0;
}
//
else if(left>document.documentElement.clientWidth-oDiv.offsetWidth){
left=document.documentElement.clientWidth-oDiv.offsetWidth;
}
//
if(right<0){
right=0;
}
//
else if(right>document.documentElenment.clientHeight){
right=document.documentElenment.clientHeight-oDiv.offsetHeight;
}
oDiv.style.left=left+"px";
oDiv.style.top=right+"px";
}
document.onmouseup=function(){
// document
document.onmousemove=null;
document.onmouseup=null;
}
// bug,
return false;
}
}