最主要是js的控制
window.onload = function(){
var oDiv = document.getElementsByTagName("div")[0];
/*鼠標(biāo)點擊的位置距離DIV左邊的距離 */
var disX = 0;
/*鼠標(biāo)點擊的位置距離DIV頂部的距離*/
var disY = 0;
oDiv.onmousedown = function(){
var e = e || window.event;
disX = e.clientX - oDiv.offsetLeft;
disY = e.clientY- oDiv.offsetTop;
document.onmousemove = function(e){
var e = e || window.event;
// 橫軸坐標(biāo)
var leftX = e.clientX - disX;
// 縱軸坐標(biāo)
var topY =e.clientY - disY;
if( leftX < 0 ){
leftX = 0;
}
/* 獲取瀏覽器視口大小 document.document.documentElement.clientWidth*/
else if( leftX > document.documentElement.clientWidth - oDiv.offsetWidth ){
leftX = document.document.documentElement.clientWidth - oDiv.offsetWidth;
}
if( topY < 0 ){
topY = 0;
}
else if( topY > document.documentElement.clientHeight -oDiv.offsetHeight ){
topY = document.documentElement.clientHeight - oDiv.offsetHeight;
}
oDiv.style.left = leftX + "px";
oDiv.style.top = topY+"px";
}
document.onmouseup = function(){
document.onmousemove = null;
document.onmouseup = null;
}
}
}
遠近互聯(lián)前端小華整理發(fā)布，希望能對學(xué)習(xí)技術(shù)的你有所幫助
遠近互聯(lián)專業(yè)提供網(wǎng)站建設(shè)、APP開發(fā)、網(wǎng)站優(yōu)化、外貿(mào)網(wǎng)站SEO、微信運營的品牌整合營銷服務(wù)讓客戶通過網(wǎng)絡(luò)品牌建立與網(wǎng)絡(luò)傳播提高業(yè)績。
