Animating jQueryUI Sortable using CSS3 transitions

Question

How can I use CSS3 transitions (or any other means) to make a jQuery Sortable act more like the list re-ordering in iOS, where list items smoothly animate while dragging, so ite

Answer 1

I've improved on all of the above by taking advantage of the 'change' function within the sortable api. This is the code. Check out the fiddle below to see the required css.

$('ul').sortable({
placeholder:'marker',
distance: 15,
cursor: 'move',
revert: 200,
start:function(ev, ui) {
   $(".marker").css({"height": "0px"});
    console.log("start");
},
change:function(ev, ui) {
    $(".marker").css({"height": "0px"});
    setTimeout(function(){
        $(".marker").css({"height": "40px"});
    },10);
} });

You can see the full code example here

http://jsfiddle.net/LTWMp/284/