vegetableman/drag-drop-dom


A drag drop utilty for dom nodes using native html api

Language: JavaScript


Drag-Drop-Dom

A simplified api for adding drag-drop functionality to dom nodes by specifying drag and drop targets.

img

##Example

var ddd = require('drag-drop-dom')({drag: '.drag', drop: '.drop'})

ddd.on('enter', function(node, target) {
    target.classList.add('highlight');
});

ddd.on('leave', function(node, target) {
    target.classList.remove('highlight');
});

ddd.on('drop', function(node, target) {
    target.appendChild(node);
});

Usage

require('drag-drop-dom')({options})

Options:

  • drag Node to drag (selector | node)
  • drop Target node to drop on (selector | node)
  • once Target node should support drop only once (true | false, default: false)

Events:

  • ddd.on('start', listener)
  • ddd.on('enter', listener)
  • ddd.on('leave', listener)
  • ddd.on('drop', listener)

Each listener for the events except start event has two parameters: node and target. node is the current node being dragged and target is the current drop target.

Project Statistics

Sourcerank 3
Repository Size 203 KB
Stars 1
Forks 0
Watchers 1
Open issues 0
Dependencies 9
Contributors 1
Tags 0
Created
Last updated
Last pushed

Top Contributors See all

vegetableman

Packages Referencing this Repo

drag-drop-dom
A drag drop utilty for dom nodes using native html api
Latest release 1.0.2 - Updated - 1 stars

Something wrong with this page? Make a suggestion

Last synced: 2018-03-06 06:37:25 UTC

Login to resync this repository