ridstack.js 是一个现代 Typescript 库，旨在帮助开发人员创建漂亮的可拖动、可调整大小、响应式引导友好的布局，只需几行代码。
您可以创建更高级的网格：允许用户保留更改、创建小部件的侧边栏以拖动到您的网格中等等。
特征:
- 纯 JS 可以在任何 UI 框架中使用
- 移动支持
- 可拖动、可调整大小的项目
- 从侧边栏拖放以插入/删除
- 响应式布局，基于列
- 保存/恢复
- 在多个网格之间拖动
- 嵌套网格
- 外部 angular、vue、react、Ember、Knockout.js 绑定等
代码获取
npm install gridstack然后在 html 中：
<script src="https://gridstackjs.com/node_modules/gridstack/dist/gridstack-h5.js"></script>
<link href="https://gridstackjs.com/node_modules/gridstack/dist/gridstack.min.css" rel="stylesheet"/>
<style type="text/css">
.grid-stack { background: #FAFAD2; }
.grid-stack-item-content { background-color: #18BC9C; }
</style>
<div></div>
<script type="text/javascript">
var items = [
{content: 'my first widget'}, // will default to location (0,0) and 1x1
{w: 2, content: 'another longer widget!'} // will be placed next at (1,0) and 2x1
];
var grid = GridStack.init();
grid.load(items);
</script>
...就是这样！ 拖放和调整大小以满足您的需求。 寻找更复杂的例子？ 查看下面的高级示例、导航栏中的链接或我们在 GitHub 中的文档
仅供个人学习参考/导航指引使用，具体请以第三方网站说明为准，本站不提供任何专业建议。如果地址失效或描述有误，请联系站长反馈～感谢您的理解与支持！
链接: https://fly63.com/nav/1682
