一个导航

Draggable JS 是一个现代的 JavaScript 拖放库，旨在为您的 Web 应用程序添加流畅的本地拖放体验。让我为您详细介绍一下这个有趣的库：

Draggable网址
该网站引入了用于创建网站UI元素的拖放功能。鼓励游客参与 屏幕上的项目。
这个网站目前处于测试阶段。虽然Draggable目前已经非常接近一个完整的版本，但是它的API仍然会有变化。

Draggable将本地浏览器事件抽象到一个全面的API中，以创建自定义的拖放体验。对于小方块的组合是可排序的、可删除的、可切换的。

1. 基本功能：

   • Draggable 是一个模块化的拖放库，允许您从小处开始，逐步添加您需要的功能。
   • 在最基本的层面上，Draggable 提供了拖放功能、快速的 DOM 重新排序、可访问的标记以及一系列事件。

2. Swappable（经典的交换）：

   • 这是一个经典的功能。将一个元素拖动到另一个元素上，它们会在 DOM 中交换位置。
   • 这对于需要保留布局尺寸的情况非常理想。

3. Sortable（排序）：

   • 可以对 DOM 节点进行排序。将集合中的项目从一个位置拖动到另一个位置，一切都会自动对齐。
   • 这是一种快速且响应灵敏的排序方式，不会影响性能。

4. Collidable（碰撞检测）：

   • 如果您想涉足游戏开发，这个功能非常有用。Collidable 可以防止可拖动元素重叠，当拖动的源元素进入或离开受限区域时，会触发碰撞事件。

5. 可访问性：

   • 拖放的可访问性是一个复杂的问题。虽然浏览器在持续改进本地解决方案，但 Draggable 为此提供了帮助。
   • 所有可拖动的元素都可以聚焦，并提供可自定义的屏幕阅读器通知。

6. 可扩展性：

   • Draggable 容易扩展。您可以编写一个自定义模块，提供您需要的功能，然后将其提交到我们的 Github 仓库进行审查。
   • 如果您需要的功能尚未存在，那么社区可能也需要。分享就是关心。

7. 交互和动画：

   • Draggable 支持大多数交互事件：鼠标、触摸和力触摸都可以直接使用，而可访问的键盘支持即将推出！
   • 动画方面，您可以从我们丰富的 CSS 选择器中选择，根据自己的喜好进行样式设置。

总之，Draggable 是一个轻量、响应式、现代的拖放 JavaScript 库，非常适合为您的 Web 应用程序添加本地感觉的拖放行为。