案例:简易的Div拖拽
阅读原文时间:2023年07月10日阅读:1

案例:简易的Div拖拽

鼠标移入Div区域后,按下鼠标左键,可以拖动Div移动;松开鼠标左键,Div拖动停止。同时要求Div不能拖出屏幕显示区域外。

拖拽原理:距离不变、三个事件(onmousedown、onmousemove、onmouseup)

解决问题:

1、拖拽过程中,鼠标容易滑出Div区块;

2、防止Div拖出页面:修正位置;

3、解除绑定事件:鼠标左键抬起后,Div不再随着鼠标移动而发生位置变化;




习题-拖拽Div滑块