Easy Drag and Drop Plugin For jQuery - dad.js

Easy Drag and Drop Plugin For jQuery - dad.js
File Size: 209 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

dad.js is a simple and easy-to-use jQuery plugin which enables drag and drop functionality on a group of DOM elements with just one JS call. Without requiring the jQuery UI library and compatible with Bootstrap grid layout.

How to use it:

1. Include the required stylesheet for basic CSS styles.

<link rel="stylesheet" href="jquery.dad.css">

2. Create a group of DOM elements that can be resorted via drag and drop inside the parent container 'demo'.

<div class="demo">
  <div>...</div>
  <div>...</div>
  <div>...</div>
  <div>...</div>
</div>

3. Add jQuery library and the jQuery dad.js script to the bottom of your web page.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jquery.dad.js"></script>

4. Just call the function on the parent element we just created and done.

$('#demo').dad();

How to use it:

2016-09-12

  • code refactoring
  • added touch support

2015-05-13

  • Firefox bug fix

2015-05-10

  • Dynamic added elements support fix

2015-05-09

  • added draggable area selection

2015-05-05

  • add a return to activate and deactivate functions

This awesome jQuery plugin is developed by williammustaffa. For more Advanced Usages, please check the demo page or visit the official website.