jQuery UI - странные глюки Dragable+Sortable
 

Пробую сделать взаимодействие двух списков по механизму описаному здесь:
http://jqueryui.com/demos/draggable/#sortable

Вроде бы работает, но как то странно - если перенести из одного списка в другой - объекты накладываются друг на друга. Такое ощущение что не отключается абсолютное позиционирование объектов.

Вот код:

<style type="text/css">
	.demo ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 10px; background:gray;}
	.demo li { margin: 5px; padding: 5px; width: 150px; border:1px solid silver;}
	.sortable {height:300px;}
	.right {text-align:right;}
	</style>
	
	<script type="text/javascript">
	$(function() {
		$(".sortable").sortable({
			revert: true
		});
		$(".draggable").draggable({
			connectToSortable: '.sortable',
			helper: 'original',
			revert: 'invalid'
		})
		$("ul, li").disableSelection();
	});
	</script>


<div class="demo">
	

<ul class="sortable">
	<li class="draggable">Item 1</li>
	<li class="draggable">Item 2</li>
	<li class="draggable">Item 3</li>
	<li class="draggable">Item 4</li>
	<li class="draggable">Item 5</li>
</ul>

<ul class="sortable">
	<li class="draggable right">Object 1</li>
	<li class="draggable right">Object 2</li>
	<li class="draggable right">Object 3</li>
	<li class="draggable right">Object 4</li>
	<li class="draggable right">Object 5</li>
</ul>

</div>