Javascript可拖动div不触发滚动
我有一个简单的 Javascript 拖动功能。您可以在这里看到它:
红色#拖动器 div 是可拖动的。它嵌套在溢出滚动 div 中,但当超过限制时它不会触发“滚动”。可能是因为它是绝对定位的。 有办法解决这个问题吗?当超过限制时让滚动发生? 谢谢
I have a simple Javascript drag function. You can see it here:
The red #dragger div is draggable. It is nested in an overflow scroll div but it doesn't trigger a "scroll" when it gets over the limit. Probably due to the fact that it is positioned absolute.
Is there a way yo fix this? Make the scroll happen when it exceeds the limits?
Thank you
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
首先,您必须为包含的 div 指定一个
position:relative
。这样,绝对定位的拖动器就会停留在其内部,并且不能越过其边界。我不确定为什么滚动不起作用,但是当您可以访问 jQuery 时,您自己编写拖动函数脚本是否有原因? jQuery 中有一个强大的函数,名为 draggable ,它完全可以满足您的需求。
First of all you have to give the containing div a
position:relative
. That way the absolutely positioned dragger stays inside of it and can't go over it's borders.I'm not sure why the scrolling doesn't work, but is there a reason you scripted your dragging function yourself while you do have access to jQuery? There's a powerful function in jQuery called draggable that does exactly what you want.
这是一个滚动的版本 http://jsfiddle.net/vcJuF/1/
我删除了内部div,这似乎有帮助。滚动条现在更新,我认为你只需要更新你的 javascript 即可在拖动时实际滚动 div。
Here's a version that scrolls http://jsfiddle.net/vcJuF/1/
I removed the inner div, which seemed to help. The scrollbars update now, I think you just need to update your javascript to actually scroll the div as you drag.