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!
我正在尝试制作一个有点像演示 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!