前端实现页面元素拖拽

要实现拖拽的效果,有两种实现方式:

    插件:Resizable | jQuery UI或者jquery-resizable-columns

    原生:文章-怎么用 javascript 实现拖拽

            

  • mousedown:记录鼠标当前坐标
  • mousemove:对比当前坐标与mousedown的坐标
  • div宽
    width : div.height + mousedownX - mousemoveX
    heigth : div.height + mousedownY - mousemoveY
  • mouseup之前重复前面的计算
  • mouseup后停止执行mousemove事件

你可能感兴趣的:(拖拽)