https://github.com/cuth/jquery.dragger
Make anything draggable for mobile and desktop with jQuery
https://github.com/cuth/jquery.dragger
Last synced: 7 months ago
JSON representation
Make anything draggable for mobile and desktop with jQuery
- Host: GitHub
- URL: https://github.com/cuth/jquery.dragger
- Owner: cuth
- Created: 2014-07-10T14:14:45.000Z (almost 12 years ago)
- Default Branch: master
- Last Pushed: 2015-12-10T21:59:43.000Z (over 10 years ago)
- Last Synced: 2025-01-28T07:05:29.398Z (over 1 year ago)
- Language: JavaScript
- Size: 205 KB
- Stars: 2
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
jquery.dragger
==============
Dragger is a module that gives you the ability to drag anything with either the mouse or touch events. It doesn't do anything to the element except for add listeners. Add the functions 'start', 'drag', and 'stop' to get the position at each step.
Dragger(element [, options][, bounds])
Example
-------
```js
// Use an element or query selector as the first parameter
// Use an object to overwrite the defaults for the second parameter
var dragger = new Dragger('#elementId', {
'start': function (pos) {
// drag has started
// pos.x is the initial left position
// pos.y is the initial top position
},
'drag': function (pos) {
// drag has moved
// pos.x is the new left position
// pos.y is the new top position
},
'stop': function (pos, hasChanged) {
// mouse or touch has ended
if (hasChanged) {
// position has changed from the original position
// pos.x is the final left position
// pos.y is the final top position
}
},
'initX': 0, // set the initial X position if it is not zero
'initY': 0, // set the initial Y position if it is not zero
'allowVerticalScrolling': true, // set this to allow vertical scrolling on touch devices
'allowHorizontalScrolling': true // set this to allow horizontal scrolling on touch devices
});
// If the position of the element that is being dragged has changed, let the dragger know
dragger.setPosition({
x: 0,
y: 0
});
// If an element can't be dragged past a certain area, set the bounds
dragger.setBounds(
minX: null,
maxX: null,
minY: null,
maxY: null
});
// Check to see if the dragger handle has moved before allowing a click
dragger.hasDragged(); // returns true or false
// Disable the instance
dragger.disable();
// Re-enable the instance
dragger.enable();
```
Plugin
------
The jQuery version supports jQuery objects as the first parameter as well as a jQuery plugin syntax.
```js
var dragger = $('#elementId').Dragger(/* { options } */);
```