10 Javascript Drag & Drop DOM Element Libraries

Dragging and dropping can be a very intuitive way for users to interact with your site or web app. People often use drag-and-drop for reordering lists of items. So here are 9 useful Javascript drag and drop libaries which allow to re-order a list of any DOM elements.



Dragmove.js

A super tiny Javascript library to make DOM elements draggable and movable. Has touch screen support. Zero dependencies and 500 bytes Gzipped.

Dragmove.js

dragula

Have you ever wanted a drag and drop library that just works? That doesn’t just depend on bloated frameworks, that has great support? That actually understands where to place the elements when they are dropped? That doesn’t need you to do a zillion things to get it to work?

 Drag and drop so simple it hurts

Sortable

Sortable is a minimalist JavaScript library for reorderable drag-and-drop lists on modern browsers and touch devices. No jQuery.

sortable

Interact.js

JavaScript drag and drop, resizing and multi-touch gestures with inertia and snapping for modern browsers.

JavaScript drag and drop

GridList

Drag and drop library for two-dimensional, resizable and responsive lists.

gridlist

Slip

A tiny library for interactive swiping and reordering of elements in lists on touch screens. No dependencies.

slip.js

ng-sortable

AngularJS Library for Drag and Drop, supports Sortable and Draggable. No JQuery/JQuery UI used. Supports Touch devices.

Angular Library for Drag and Drop

React DnD

React DnD is a set of React higher-order components to help you build complex drag and drop interfaces while keeping your components decoupled.

React DND

Layout Grid

Static responsive grid with pure css. Javascript using native Drag’n’drop to reorder for each screen size.

Static responsive grid with pure css.

scriptaculous

scriptaculous is a set of JavaScript libraries to enhance the user interface of web sites. It provides an visual effects engine, a drag and drop library (including sortable lists), a couple of controls (Ajax-based autocompletion, in-place editing, sliders) and more.

script.aculo.us Web 2.0 JavaScript

0 Comments

  1. Timsays:

    I definitely use a couple of libraries in my work. Interesting list, thanks!

  2. Hermansays:

    I like Dragula purely because of the name haha. Thanks for the list

Leave a comment

Please be polite. We appreciate that. Your email address will not be published and required fields are marked

This site uses Akismet to reduce spam. Learn how your comment data is processed.