Dev Blog

Sometimes when creating sortable user interface widgets, some various quirks might happen. One of these is that just after starting dragging element, it jumps of from original location. Element will move above cursor for roughly height of it's parent container minus one sortable element.

There are plenty solutions including JavaScript to fix container height. These are clunky as it need to be assigned to each sortable. Even more problematic when used with Knockout JS sortable, as including JavaScript in HTML attributes is not pretty and really not recommended.

I turned out that properly styled container will remedy jumping issue. The point is to make it's overflow auto:

.my-sortable-container{
    overflow: auto;
}

That's it! Now sorted item should not jump anymore. Credits goes to: http://stackoverflow.com/a/24122186/5444623

This is how described bug look like:

After applying fix dragged element should be under cursor: