awesome-repositories.com
博客
awesome-repositories.com

通过 AI 驱动的搜索,发现最优秀的开源仓库。

探索精选搜索开源替代品自托管软件博客网站地图
项目关于排名机制媒体报道MCP 服务器
法律隐私政策服务条款
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
SortableJS avatar

SortableJS/Sortable

0
View on GitHub↗

Sortable

Sortable is a framework-agnostic JavaScript library for creating reorderable lists through drag and drop interactions. It functions as a reorderable list manager that allows users to rearrange DOM elements using pointer interactions on modern browsers and touch devices.

The library enables the transfer or cloning of items between different lists using shared group identifiers. It supports complex organizational structures, including nested reorderable lists for managing hierarchical data across different levels.

Its capabilities cover the animation of element movements and the configuration of drag directions along horizontal or vertical axes. The tool provides controls for interaction filtering through designated drag handles and the ability to select and move multiple items simultaneously.

Users can serialize list orders into arrays of identifiers to persist the sequence of elements across sessions.

AI 搜索

探索更多 awesome 仓库

用简单的语言描述您的需求 —— AI 将根据相关性为您从数千个精选开源项目中进行排序。

Start searching with AI
sortablejs.github.io/Sortable
↗

Features

  • Drag and Drop Libraries - Ships a comprehensive library for implementing drag-and-drop interactions for reorderable lists across modern browsers.
  • List Reordering Components - Provides a framework-agnostic system for visually rearranging items within lists or grids via drag-and-drop.
  • Cross-Container Item Transfer - Allows moving or cloning items between different list containers using shared group identifiers.
  • Drag and Drop Configurations - Specifies whether elements are reordered along a horizontal or vertical axis using a static value or dynamic function.
  • Nested Drag Containers - Enables the creation of hierarchical structures by nesting sortable lists within other lists.
  • Drag-and-Drop Row Reorderers - Provides UI components that allow users to manually rearrange the sequence of items in a list via drag-and-drop interactions.
  • Element Positioning Utilities - Tracks DOM element coordinates in real time to determine movement and swap thresholds.
  • Event-Driven State Managers - Manages the internal state of drag phases using event listeners for mouse and touch interactions.
  • Multi-List Item Transfer - Supports complex organization by allowing items to be moved between nested list levels.
  • List State Persisters - Provides mechanisms to save and restore the sequence of elements to maintain state across sessions.
  • List Sequence Serialization - Extracts the current sequence of items into an array of identifiers for saving or processing.
  • CSS Transitions - Uses CSS transitions to provide smooth sliding animations when items change positions.
  • Custom Drag Behaviors - Allows the implementation of specialized drag behaviors including custom handles and swap-based reordering.
  • Draggable Filters - Prevents specific elements within a list from being dragged to allow integrated buttons.
  • Draggable Item Filters - Allows specific elements within a sortable list to be prevented from being dragged.
  • Ghost Elements - Provides a ghost-element visual proxy to maintain layout stability during item reordering.
  • Drag Operation Controls - Provides controls to restrict drag movements to specific vertical or horizontal axes.
  • Drag Handles - Supports designating specific DOM elements as drag handles to restrict where interactions start.
  • Drag-and-Drop Cloning - Supports cloning items across lists, leaving the original element in its source position.
  • Framework Agnostic UI Logic - Provides interface behavior and state management for lists without enforcing a specific rendering framework.
  • Interactive UI Components - Implements pointer-based interactions and animations to enhance user interaction with web elements.
  • List Transition Animations - Animates the shifting of items within a collection to provide a fluid reordering experience.
  • Multi-Item Drag Operations - Enables the selection and simultaneous movement of multiple list items as a single group.
  • Swap-Based Reordering - Implements a swap-based interaction model that exchanges positions of two items instead of shifting the list.
  • Position Swapping - Exchanges the positions of two specific items without shifting the entire list order.
  • Programmatic List Sorting - Provides APIs to programmatically rearrange the sequence of UI elements based on an array of identifiers.
  • Selection Groups - Supports the selection and movement of multiple list items simultaneously as a single group.
  • Drag and Drop - Drag-and-drop list reordering library.
31,135 星标·3,731 分支·JavaScript·MIT·8 次浏览

Star 历史

sortablejs/sortable 的 Star 历史图表sortablejs/sortable 的 Star 历史图表

常见问题解答

sortablejs/sortable 是做什么的?

Sortable is a framework-agnostic JavaScript library for creating reorderable lists through drag and drop interactions. It functions as a reorderable list manager that allows users to rearrange DOM elements using pointer interactions on modern browsers and touch devices.

sortablejs/sortable 的主要功能有哪些?

sortablejs/sortable 的主要功能包括:Drag and Drop Libraries, List Reordering Components, Cross-Container Item Transfer, Drag and Drop Configurations, Nested Drag Containers, Drag-and-Drop Row Reorderers, Element Positioning Utilities, Event-Driven State Managers。

sortablejs/sortable 有哪些开源替代品?

sortablejs/sortable 的开源替代品包括: rubaxa/sortable — Sortable is a JavaScript drag and drop library used to create reorderable lists of HTML elements. It is a… bevacqua/dragula — Dragula is a JavaScript drag and drop library and DOM element manipulator used to move and reorder HTML elements… sortablejs/vue.draggable — Vue.Draggable is a component-based library for Vue.js that enables drag-and-drop functionality within web interfaces.… sortablejs/vue.draggable.next — This project is a drag-and-drop UI library and a Vue 3 component for implementing sortable lists and state-synced… alfred-skyblue/vue-draggable-plus — vue-draggable-plus is a drag-and-drop library for Vue 2 and Vue 3 used to create data-bound draggable interfaces. It… shopify/draggable — Draggable is a JavaScript library for implementing draggable elements and sortable lists within a web browser. It…

Sortable 的开源替代方案

相似的开源项目,按与 Sortable 的功能重合度排序。
  • rubaxa/sortableRubaXa 的头像

    RubaXa/Sortable

    31,135在 GitHub 上查看↗

    Sortable is a JavaScript drag and drop library used to create reorderable lists of HTML elements. It is a framework-agnostic tool and a touch-enabled interaction library that functions across modern browsers and touch devices without dependencies on specific web frameworks. The library enables the movement and cloning of elements between different containers using shared group configurations. It supports the repositioning of multiple items simultaneously and the use of specific drag handles to restrict which areas of an element trigger a move. Additional capabilities include programmatic sor

    JavaScript
    在 GitHub 上查看↗31,135
  • bevacqua/dragulabevacqua 的头像

    bevacqua/dragula

    22,160在 GitHub 上查看↗

    Dragula is a JavaScript drag and drop library and DOM element manipulator used to move and reorder HTML elements between multiple containers. It functions as a UI interaction framework and event manager that tracks drag lifecycles to facilitate the movement of elements within a web browser interface. The library distinguishes itself through configurable constraint validation, allowing developers to define which elements are draggable and which containers are permitted drop targets. It supports specialized interaction patterns such as element cloning, the use of specific drag handles to restri

    JavaScriptcomponentdrag-and-dropdrag-drop
    在 GitHub 上查看↗22,160
  • sortablejs/vue.draggableSortableJS 的头像

    SortableJS/Vue.Draggable

    20,626在 GitHub 上查看↗

    Vue.Draggable is a component-based library for Vue.js that enables drag-and-drop functionality within web interfaces. It functions as a wrapper for the SortableJS engine, bridging the gap between imperative DOM manipulation and the declarative nature of the Vue.js reactive system. By synchronizing user interface interactions with the underlying data model, it ensures that list reordering and element movement are automatically reflected in the application state. The library supports complex interaction patterns, including the ability to move items between lists, clone elements using keyboard m

    JavaScriptcomponentdrag-and-dropvue
    在 GitHub 上查看↗20,626
  • sortablejs/vue.draggable.nextSortableJS 的头像

    SortableJS/vue.draggable.next

    4,499在 GitHub 上查看↗

    This project is a drag-and-drop UI library and a Vue 3 component for implementing sortable lists and state-synced interfaces. It acts as a wrapper for the Sortable.js library, providing a state-synced list component that automatically updates the underlying data array when items are reordered or moved. The library supports nested draggable interfaces and hierarchical data organization, allowing draggable containers to be nested inside other movable items to create multi-level structures. It also enables multi-column data transfer, allowing elements to be moved or cloned between different drag

    JavaScript
    在 GitHub 上查看↗4,499
查看 Sortable 的所有 30 个替代方案→