Drag & Drop Jquery
<p>I am using <code>jQuery</code> droppable &amp; draggable and its working but I need some customization. I want at drop event that the dragged element should go at position 1 then 2, 3 so on. And the other list should auto adjust the blank space after dragging the element. The current  css code is not working fine. </p>

<pre><code>$( ".go" ).draggable({
                revert:'invalid',
                scope:'item'
            });
    $( "#droppable" ).droppable({
        scope:'item',
            //hoverClass:'ui-hover',
        drop: function( event, ui ) {
                            //alert('');
            //$(this).addClass("drpcls");
            //$( this ).find( "p" ).html( "Dropped!" );
            //ui.droppable.addClass = "drpcls";
                            ui.draggable.css({
                                "float":"left",
                                "border":"1px solid",
                                "margin":"10px",
                                "position":"absolute",
                                "width":"100%",
                                "z-index":"1"
                            });
                            if ($(this).children().length == 0) {
                                // ui.draggable.addClass("thumbnail");
                                $(ui.draggable).appendTo(this);
                                //$(this).removeClass("border");
                            }

            /*for(var k in ui.draggable){
                alert(k);
            }*/
        }
    });
});
</code></pre>
