Tiny Interactive Drag And Drop Library – Fastdrag

Category: Drag & Drop , Javascript | July 4, 2019
Author:qkorbit
Views Total:232 views
Official Page:Go to website
Last Update:July 4, 2019
License:MIT

Preview:

Tiny Interactive Drag And Drop Library – Fastdrag

Description:

Fastdrag is a super tiny, eas-to-use, Vanilla JavaScript drag and drop library with support for configurable friction, rotate, and scale effects on drag.

How to use it:

Install the fastdrag with NPM.

# NPM
$ npm install fastdrag --save

Import the Fastdrag module (ES 6).

import Fastdrag from 'Fastdrag'

Or include the UMD version of the Fastdrag library from the CDN.

<script src="https://unpkg.com/[email protected]est/dist/fastdrag.min.js"></script>

Create a new Fastdrag instance and apply the drag and drop functionality to an element you specify.

<div id="demo"></div>
let demo = document.getElementById('demo');
let instance = new Fastdrag({
  el: demo
});

Config the friction, rotate, and scale effects.

let instance = new Fastdrag({
    el: demo,
    friction: 3,
    rotateRange: 60,
    scale: 1
});

Move the element to a specific position.

instance.to(element, options);

Destroy the instance.

instance.destroy();

Event handlers.

instance.on('start', e => {
  // drag start
})
instance.on('move', e => {
  // move
})
instance.on('end', e => {
  // drag end
})

You Might Be Interested In:


Leave a Reply