JSplumb 可滚动容器

JSplumb scrollable container

我正在尝试制作一个有点像演示 here, where the container element scrolls when you drag an item towards the edge of the screen. So far I have this example 的 JSPlumb 应用程序,其中的元素是可拖动的,但它们受到周围容器的限制,极大地限制了这些元素的数量屏幕。

我用这段代码启动了可拖动对象。也许这里有一个可用的滚动属性?

jsPlumb.draggable(newState, {
    containment: 'parent'
});

我终其一生都无法找出另一个滚动的确切原因,我尝试更改 css 并向可拖动对象添加一些 jqueryUI 属性,但无济于事。

有更多 JSPlumb 经验的人知道我如何使容器扩展吗?

TLDR: 如何制作my draggables scroll like this example

我终于得到了答案,这是一件CSS的事情。我仔细查看了演示中的 CSS 并找到了这两个 类.

.jtk-surface {
    overflow: hidden !important;
    position: relative;
    cursor: move;
    cursor: -moz-grab;
    cursor: -webkit-grab;
    touch-action:none;
}
.jtk-surface-nopan {
    overflow: scroll !important;
    cursor:default;
}

一旦我将这些 类 添加到我的容器 div 并从 draggable init 中删除 "container" 属性,它就成功了!

jsPlumb.draggable(newState, {

});

检查工作中的 pastebin here