Jump to content
Fi8sVrs

Draggable - a lightweight, responsive, modern drag & drop library

Recommended Posts

  • Active Members

30787041-84ccc1aa-a14e-11e7-982d-9729781

  • Basics

Draggable is a modular drag & drop library, allowing you to start small and build up with the features you need. At its most basic, Draggable gives you drag & drop functionality, fast DOM reordering, accessible markup, and a bundle of events to grab on to.

 

  • Swappable

The classic switcheroo. Drag one element over another and watch them trade places in the DOM. The ideal functionality for when layout dimensions need to be retained.

 

  • Sortable

Sort DOM nodes with style. Drag items in a collection from one spot to another and watch everything snap into place. Fast and responsive sorting that won’t leave your performance wallet strapped for frames.

 

  • Collidable

Start your game dev career and inject some collision detection. Collidable will prevent draggable elements from overlapping each other, firing collision events when the dragged source element enters and exits a restricted zone.

 

  • Accesible

Drag & drop accessibility is a delicate flower. While browsers continue to work on a reliable native solution, Draggable lends a helping hand by providing all the proper aria attributes in all the right places.

 

  • Extensible

Draggable is easy to extend – write a custom module that provides the functionality you need, then submit it to our Github repo for review. If you needed a feature that wasn’t already available, chances are the community needs it to. Sharing is caring.

 

  • Interaction

Draggable supports most of the interaction events we could think of – mouse, touch, and force touch are all available out of the box, with accessible keyboard support coming soon!

 

  • Animation

Let’s face it, its annoying when plugins get in the way of your personal design touch. Draggable isn’t going to try and steal the show by forcing any unruly animation styles on you. Simply take your pick from our healthy serving of CSS selectors and style to your heart’s desire.

 

Download v1.0.0-beta.zip

or

git clone https://github.com/Shopify/draggable.git

 

Sources:

Edited by Fi8sVrs
  • Upvote 2
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.



×
×
  • Create New...