怎么拖动鼠标实现移动功能(实现鼠标拖动效果)

首先,简单设置了一个div 设置id值为as ,如下

怎么拖动鼠标实现移动功能(实现鼠标拖动效果)(1)

怎么拖动鼠标实现移动功能(实现鼠标拖动效果)(2)

样式方面,关键得设置为相对定位,position: absolute;

得得到div的id值,

怎么拖动鼠标实现移动功能(实现鼠标拖动效果)(3)

要实现拖动效果,就得实现三个鼠标关键点

//鼠标事件1 -在div按下(要计算鼠标相对拖动元素的左上角的坐标,并且标记元素为可拖动)

怎么拖动鼠标实现移动功能(实现鼠标拖动效果)(4)

鼠标事件2 -鼠标移动时(要检测,元素是否为可标记移动,如果是,则更新元素的位置,到当前鼠的位置(ps:要减去第一步中获得的偏移))

鼠标事件3:就相对简单了。就是鼠标松开时 标记元素为不可拖动状态,代码如下

怎么拖动鼠标实现移动功能(实现鼠标拖动效果)(5)

水平有限,如有不足,敬请谅解!

只是想借这样的机会,提升自己 !谢谢。

,

免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com

    分享
    投诉
    首页