文章出處
文章列表
直觀的理解div拖拽：當鼠標對著可拖拽部分按住后并拖動，div會跟著鼠標一起運動，并且其運動空間限制在瀏覽器內部，當放開鼠標時，則div停止運動。
實現div拖拽需要三個重要的事件：
（1）onmousedown-鼠標按下事件
（2）onmousemove-鼠標移動事件
（3）onmouseup-鼠標抬起事件
當鼠標移出瀏覽器后再回到瀏覽器內部時，會丟失對div的控制，需要再次按下鼠標移動div，為了改善這一小問題，代碼中使用了setCapture和releaseCapture。
其中，setCapture方法是用于監視鼠標操作事件，即使鼠標移出瀏覽器照樣能夠捕捉到鼠標位置，當鼠標移回瀏覽器內部時，此時div依然跟隨著鼠標移動；當然，releaseCapture方法就是釋放對鼠標操作事件的監視。
需要注意的重點是div的坐標問題，當鼠標按住div后移動，div要跟著鼠標時時改變位置坐標。
效果展示
文章列表
全站熱搜
留言列表
