Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Touch updates; auto scroll; multi-container #3

Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
# Created by .ignore support plugin (hsz.mobi)
### JetBrains template
# Covers JetBrains IDEs: IntelliJ, RubyMine, PhpStorm, AppCode, PyCharm, CLion, Android Studio

## Directory-based project format:
.idea/
38 changes: 28 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,25 +1,43 @@
#jquery-dragarrange
### A very basic jQuery plugin to shift element position by drag
### A jQuery plugin to shift element position by drag & drop

If you are looking for a library which can be ordered/arranged by drag, you are at right place. This plugin doesn't require any CSS change, just call the function on elements you want to be arranged, and you are done.
If you are looking for a library which can be ordered/arranged by drag, you are at right place.
This plugin doesn't require any CSS change, just call the function on elements you want to be arranged, and you are done.
The intent of the plugin is to:

* Allow easy drag and drop reordering of elements within a container
* Allow for elements added dynamically to also be sortable
* Automatically scroll when reaching window border for long lists

How to Use
----------
```html
<div id="elements-container">
<div class="draggable-element d-1">Drag 1</div>
<div class="draggable-element d-2">Drag 2</div>
<div class="draggable-element d-3">Drag 3</div>
<div class="draggable-element d-4">Drag 4</div>
<div class="draggable-element">Drag 1</div>
<div class="draggable-element">Drag 2</div>
<div class="draggable-element">Drag 3</div>
<div class="draggable-element">Drag 4</div>
</div>
```
Call the function:
$('.draggable-element').arrangeable();
```javascript
$('.draggable-element').dragArrange('.draggable-element');
```
Note that the selector is provided twice: once as a jQuery selector, and once as a dragArrange argument.
This may seem redundant. However, the selector is used internally and since [jQuery has deprecated the .selector property](http://api.jquery.com/selector/),
this was a low friction way of accessing the data reliably.

Optional Parameters
-------------------
###cssPrefix
String to be prepended to the default "dragging" class assigned to any actively dragging DOM element.

###containerSelector
jQuery selector to define the single parent over all draggable element containers that should behave together.

###dragSelector
If passed, object can be dragged only from this selector. The default dragSelector is same DOM element that has called the function.
jQuery selector of element within a draggable element to be used as the drag handle. If not set, the entire draggable
element acts as the handle.

###Setup
```
Expand All @@ -28,8 +46,8 @@ bower install jquery-dragarrange
Or you can download latest library from [here](https://github.com/vishalok12/jquery-dragarrange/releases).

###Demo
http://vishalok12.github.io/jquery-dragarrange/
http://jaredcarlow.com/projects/jquery-dragarrange/

### License
Dragarrange is licensed under the [MIT license](http://opensource.org/licenses/MIT).
Copyright (c) 2014 [Vishal Kumar](http://github.com/vishalok12)
Copyright (c) 2014 [Vishal Kumar](http://github.com/vishalok12), 2015 Jared Carlow
Loading