drag-tracker
v1.0.0
Published
A simple library for dragging things around. Tracks dragging with touch or mouse.
Downloads
43,160
Readme
drag-tracker
A simple library for dragging things around. Tracks dragging with touch or mouse (left button).
Demo
https://rawgit.com/Sphinxxxx/drag-tracker/master/demo/index.html
https://codepen.io/Sphinxxxx/pen/KXedQe
Usage
dragTracker({
container: /* The element the user can drag within */,
selector: /* CSS selector for elements inside the container that are draggable, or a single HTML element */,
callback: /* Your code which decides what happens during a drag operation */,
callbackDragStart: /* Optional callback when a drag operation is about to start */,
callbackDragEnd: /* Optional callback when a drag operation has ended */,
callbackClick: /* Optional callback when a draggable element is only clicked, not dragged */,
propagateEvents: /* Whether to let mouse/touch events propagate (bubble) after being handled. Usually not wanted in case multiple handlers track the same container */,
roundCoords: true /* Whether callback coordinates should be integers */,
dragOutside: true /* Whether the draggable elements can be dragged outside the bounds of the container */,
/* Whether callback coordinates should be adjusted to suit the dragged element instead of the actual mouse position */
handleOffset: true (default) /* Coordinates are the element's center for SVG `<circle>`s and `<ellipse>`s, and the top-left corner for all other elements */,
'center' /* Coordinates are always the element's center */
'topleft' /* Coordinates are always the element's top-left corner */
false /* No adjustment, just use the mouse position */
});
All options are optional. Without a callback
, the coordinates are written to console.log
.