vSort v1.2

vSort is a simple jQuery plugin for making lists sortable with a handle

less than 1.6kB including css
Tested in IE8, FireFox, Chrome, Touch enabled for mobiles

Features

Restrictive sort, aka selected elements not crossing each other (v1.2)
Touch-enabled for mobile (v1.1)
Nested sorting within lists (v1.0)
callback function on successful sort (v1.0)
Live Demo

To include vSort plugin

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.vSort.min.js"></script>

To run a javascript code after sorting is done

data-callback="alert('list order modified')"

Sample code

<style>
    #demo {background:#E2E2E2;border:2px solid red;}
    .sortitem{background:#fff;border:2px solid #ccc;padding-left:20px;}
    .sortitem .sorthandle{position:absolute;top:5px;bottom:5px;left:3px;width:8px;display:none;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAB3RJTUUH3wIDBycZ/Cj09AAAAAlwSFlzAAALEgAACxIB0t1+/AAAAARnQU1BAACxjwv8YQUAAAAWSURBVHjaY2DABhoaGupBGMRmYiAEAKo2BAFbROu9AAAAAElFTkSuQmCC');}
    .sortitem:hover .sorthandle{display:block;}
</style>
<!-- sort container -->
<div id="demo" data-callback="alert('list order modified')"> <!-- callback script to run on successful sort -->
    <div class="sortitem"> <!-- sort item -->
        <span class="sorthandle"> </span> <!-- sort handle -->
        111111<br>111111
    </div>
    <div class="sortitem" data-restrict="alpha"> <!-- restrict sort, not-to-cross another alpha item -->
        <span class="sorthandle"> </span>
        I am alpha<br>I don't cross beta<br>Try
    </div>
    <div class="sortitem">
        <span class="sorthandle"> </span>
        333333<br>333333<br>333333<br>333333
    </div>
    <div class="sortitem" data-restrict="beta">
        <span class="sorthandle"> </span>
        Yep - I don't cross Yo
    </div>
    <div class="sortitem">
        <span class="sorthandle"> </span>
        Yes
    </div>
    <div class="sortitem" data-restrict="alpha">
        <span class="sorthandle"> </span>
        I am beta<br>I also don't cross alhpa<br>Its obvious ;)
    </div>
    <div class="sortitem" data-restrict="beta">
        <span class="sorthandle"> </span>
        Yo - I don't cross Yep
    </div>
</div>

To update vSort-lists after new items are added to sort container

$().vSort();