Question

I have this situation

<ul>
 <li id="first">
    1
 </li>
 <li id="second">
    2
 </li>
 <li id="third">
    3
 </li>
</ul>

I would like to prevent dropping 2nd and 3rd LI element before 1st LI element, so in this situation only 2 and 3 should be swappable.
I managed to prevent dragging of first element with

.sortable({handle:"li",axis:"y","cancel":"#first"}) 

but that doesn’t solve dropping element before first element in the list.

Answer 1

Specify which items in your ul are sortable:

$( "#sortable1" ).sortable({
    items: "li:not(.ui-state-disabled)"
});

Documentation