Web 应用程序的用户可拖动部分

Question

我想知道如何复制可拖动的列/行分隔符的功能，例如 http://jsfiddle.net/。

这是建立在某个库之上的吗？

谢谢！

Answer 1

jsfiddle站点中的可拖动分隔符是使用jsfiddle.net/js/LayoutCM.js和jsfiddle.net/codemirror/js/codemirror.js中的代码实现的。

注意：SO 中的新代码更改使得直接链接到 jsfiddle 实现以解释它们如何实现某些东西非常繁琐。

其他相关的 StackOverflow 问题包括

• Resize elements by dragging divider handler
• Draggable div without jquery ui
• What is a lightweight script jquery extension that implements a draggable divide ?

提供各种项目的功能，包括 jquery 插件和其他 javascript 脚本

• jquery-divider
• jquery-splitter
• splitplane
• jqueryui Resizable（作为组件实现）
• jqueryui Draggable（作为组件实现）
• mootools splitter
• yui resize（作为组件实现）
• jquery split plane

还可以查看其他资源，包括

• An example jquery splitplane implementation
• The example splitplane in Google's closure library
• split plane control in yui example

大多数人似乎使用现有的 jquery 插件或使用 Draggable 和 Resizable 组件自己实现，例如代码参见提到的其他 StackOverflow 帖子。