Sortable is Not just for lists : Sortable « Scriptaculous « JavaScript DHTML






Sortable is Not just for lists

 

<html>
<head>
<title>Untitled Document</title>

<script src="scriptaculous-js-1.8.2/lib/prototype.js" type="text/javascript"></script>
<script src="scriptaculous-js-1.8.2/src/scriptaculous.js" type="text/javascript"></script>
<script src="scriptaculous-js-1.8.2/src/unittest.js" type="text/javascript"></script>

<script type="text/javascript">
Event.observe(window, 'load', function() {
  Sortable.create('chapter', { tag: 'p', only: ['orderable', 'moveIt'] });
});

</script>

</head>
<body>


<div id="chapter">
    <p>This stays on top.</p>
    <p class="orderable">Sortable.</p>
    <p class="orderable">And this too!</p>
    <p class="moveIt">sortable.</p>
    <p>This stays at bottom.</p>
</div>
    
</body>
</html>

   
  








Related examples in the same category

1.Sortable with ghosting effects
2.Sortable two-lists
3.Sortabled list with handlers
4.Sortable list updated event
5.drag and drop to sort
6.Sort and reorder the ordered list
7.Sortable onChange event and onUpdate event
8.Horizontally Sortable
9.Two sortable groups