jQuery Plugin To Create Touch-enabeld Moveable Elements - elementMove.js
| File Size: | 247 KB |
|---|---|
| Views Total: | 385 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
elementMove.js is a simple jQuery plugin which makes any DOM elements movable with support for touch events, momentum movement and callbacks.
Basic usage:
1. To get started, you need to include both jQuery library and the jQuery elementMove.js plugin on your html page.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="dist/elementMove.js"></script>
2. Call the function on the element to make it movable.
('.movableElement').elementMove();
3. Config the movement behaviors with the following options.
('.movableElement').elementMove({
// returns to start position after release
backToOrigin: false,
// CSS transition used for this effect
backToOriginAnimation: 'cubic-bezier(0.39, 0.58, 0.54, 1.42)',
// animation time
backToOriginAnimationDuration: 0.5,
//0 : x, 1 : y, 2 : full, 3 : up, 4 : down, 5 : right, 6 : left
swipeDirection: 2,
// enable momentum movement
momentum: false,
// When you scroll past this value on the x-axis, scrollAmountCallback will fire.
xScrollAmount: 1,
// When you scroll past this value on the y-axis, scrollAmountCallback will fire.
yScrollAmount: 1,
// callbacks
scrollAmountCallback: function() {},
moveCallback: function() {},
endCallback: function() {}
});
This awesome jQuery plugin is developed by ben182. For more Advanced Usages, please check the demo page or visit the official website.





