Mobile Compatible Drag And Drop Library – Draggin.js

Category: Drag & Drop , Javascript | May 26, 2019
Views Total:4,477 views
Official Page:Go to website
Last Update:May 26, 2019


Mobile Compatible Drag And Drop Library – Draggin.js


Draggin.js is a fast, cross-browser and mobile-compatible drag and drop library for JavaScript.

Thanks to the CSS transform property, the library automatically calculates the new position of the element relative to the top left of the page and then re-position the element to prevent from breaking the layout.

How to use it:

Insert the minified version of the Draggin.js into the document.

<script src="draggin.min.js"></script>

Add the CSS class ‘draggable’ to any element which should be draggable.

<img class="draggable" src="1.jpg"> 
<h1 class="draggable">Drag me</h1>

Make a text element editable with the ‘text’ class.

<h1 class="draggable text">Drag me</h1>



  • Added support for IE and Edge


  • Rename dragScript.js to draggin.js

You Might Be Interested In:

One thought on “Mobile Compatible Drag And Drop Library – Draggin.js

  1. Melissa

    Hi, i wonder if you can help me. I love this draggin function its really simple and easy to use. But when i use it on a mobile device when the mobile device is held portrait it works perfectly. When it’s held in landscape mode the elements sort of ‘jump around’ and don’t follow your finger. Could you help me or give advice on how to fix this?


Leave a Reply