tBar.onmousedown = function() {
var eve = getEvent();
moveable = true;
//4.事件属性是指事件所引发的状态及事件本身特有的一些特性。
//clientX事件返回当前事件被触发时鼠标指针向对于浏览器页面的水平坐标。
//pageX/pageY是鼠标相对于整个页面的X/Y坐标,整个页面也就是你整个网页的全部,比如你的网页很长,那么最大值就是他们了
//clientX/clientY是事件发生时鼠标在浏览器内容区域的X/Y坐标,就是用来显示网页的可视区域,也就是说需要拖动滚动条才能看到的不算,当窗口大小改变时,他俩的值也会改变。
mouseX = eve.clientX;
mouseY = eve.clientY;
toTop = parseInt(win.style.top);
toLeft = parseInt(win.style.left);
//事件二:移动鼠标事件
tBar.onmousemove = function() {
if(moveable) {
var eve = getEvent();
var x = toLeft + eve.clientX - mouseX;
var y = toTop + eve.clientY - mouseY;
if(x > 0 && (x + width < w) && y > 0 && (y + height < h)) {
win.style.left = x + "px";
win.style.top = y + "px";
}
}
}
//事件三:放下鼠标事件,注意这里是document,而不是tBar
document.onmouseup = function() {
moveable = false;
}那个移动鼠标事件的那些的什么意思,var x = toLeft + eve.clientX - mouseX; var y = toTop + eve.clientY - mouseY; if(x > 0 && (x + width < w) && y > 0 && (y + height < h)) { win.style.left = x + "px"; win.style.top = y + "px";
1 回答
已采纳
QQ_随意
TA贡献51条经验 获得超28个赞
var x = toLeft + eve.clientX - mouseX; //toLeft是被點擊物體離瀏覽器頂部的top距離 //eve.clientX是當前鼠標位於這個瀏覽器窗口左上角的距離 //mouseX是你鼠標點擊時鼠標位於這個瀏覽器窗口左上角的距離 //比如你當前物體離瀏覽器左邊100px //你在150px的地方點擊進行拖拽 //var x = 100 + 150 - 150; //然後你向左拖拽1px的時候 x = 100 + 149 - 150; var y = toTop + eve.clientY - mouseY; //同理 if(x > 0 && (x + width < w) && y > 0 && (y + height < h)) //防止x和y的值小於0或者大於瀏覽器寬度(高度) //防止你拖拽的時候把問題拉到瀏覽器外面
希望對你有幫助
添加回答
举报
0/150
提交
取消