拖拽放弃IPad Web App - 同时保留Scroll功能
我正在使用Jquery UI拖放( http://jqueryui.com/demos/draggable )与 https://github.com/furf/jquery-ui-touch-punch
将触摸事件映射到鼠标事件。到目前为止,整个拖放工作正常。
I am using Jquery UI Drag and Drop ( http://jqueryui.com/demos/draggable ) together with https://github.com/furf/jquery-ui-touch-punch to map touch events over to mouse events. The whole drag and drop thing works fine so far.
我现在遇到的问题是我有一长串可拖动元素,我需要能够滚动浏览IPad上的列表......当我使列表元素可拖动时,这将不再起作用。
The problem I have now is that I have a long list of draggable elements and I need to be able to scroll through the list on IPad as well... When I made the list elements draggable this won't work anymore.
我尝试使用jqueryui提供的约束,如距离
和延迟
- 但即便如此,滚动事件似乎完全禁用/覆盖拖动事件。
I tried using the jqueryui provided constraints like distance
and delay
- but even then the scroll event seems to be totally disabled / overlayed with the drag event.
我可能需要编写一个自定义函数,例如只有向左移动至少50 px使其可拖动或其他东西。
I probably need to write a custom function like "only if move to left at least 50 px make it draggable" or something.
有没有人遇到类似的问题并且愿意分享这个问题?
Sencha或JQmobile等任何其他移动网络框架都配备了这样的功能吗?
Has anybody ever encountered a similar problem and is willing to share som thoughts about it? Are any other mobile web frameworks like Sencha or JQmobile equipped with such functionality?
提前致谢...
我通过切换 https://github.com/furf/jquery-ui-touch-punch
此解决方案中的代码: Javascript拖放触摸设备。
最后我需要调整是删除 event.preventDefault();
重新启用搜索。
In the end all I needed to adjust was to remove the event.preventDefault();
to re-enable scolling.
编辑
基本上我使用了我链接的第二个答案中的代码 - 进行了一些调整。
这是我的解决方案的JS小提琴,希望它有所帮助: http://jsfiddle.net/ LQuyr / 8 /
Basically I used the code from the second answer I linked - with some adjustments. Here is the JS fiddle of my solution, hope it helps: http://jsfiddle.net/LQuyr/8/