C语言学习网

如何解决JavaScript限制在客户区可见范围的拖拽的问题

发表于:2022-10-04 作者:安全数据网编辑
编辑最后更新 2022年10月04日,这篇文章主要为大家展示了"如何解决JavaScript限制在客户区可见范围的拖拽的问题",内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下"如何解决JavaScr

这篇文章主要为大家展示了"如何解决JavaScript限制在客户区可见范围的拖拽的问题",内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下"如何解决JavaScript限制在客户区可见范围的拖拽的问题"这篇文章吧。

限制范围的拖拽,要求被拖拽的对象必须在客户区可见范围!

div是body的子元素,div的left/top是针对body的,不是针对可见客户区的,所以在拖拽的过程中不得不考虑被卷走的部分,因为网页文档可能很大,无论宽度还是高度都可能大于客户区,等于客户区大小就很好处理,大于的话就得考虑scrollTop和scrollLeft,否则div会跟鼠标脱离,因为距离都算错了。

/*切记:凡是clientX/Y 的 一定记得卷走的部分*/document.body是DOM中Document对象里的body节点,document.documentElement是文档对象根节点(html)的引用,document.documentElement.scrollHeight网页整体高度
function getPos(ev) {  var st = document.documentElement.scrollTop || document.body.scrollTop;  var sl = document.documentElement.scrollLeft || document.body.scrollLeft;  return {x:sl+ev.clientX, y:st+ev.clientY};}
    客户区可见范围限制拖拽    

以上是"如何解决JavaScript限制在客户区可见范围的拖拽的问题"这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注行业资讯频道!

0