jquery - リスト内のアイテムを並べ替えて配置しようとすると、jQueryUI の並べ替え可能なちらつきとジャンプが発生する

Question

アイテムの長いリストがある場合、jQueryUI sortable を使用しています。順序を変更してアイテムの周りにドラッグしようとすると、ちらつき、画面上でジャンプしてアイテムを注文することが事実上不可能になります。

アイテムをドラッグすると、「ここに配置」プレースホルダーが実際にアイテムをドロップしたい場所から何マイルも離れているように見えますか?

アイテムを移動/注文しようとしたときに、画面のちらつきやジャンプをなくすにはどうすればよいですか?

ここに完全なデモがあります http://jsfiddle.net/w3vvL/63/

私は今ここでアイデアを使い果たしています。だから、どんな助けも素晴らしいでしょう！

以下のコードは単なるスニペットで、残りは上のフィドルにあります。ありがとう

    //Connect the two lists enable dragging between each one
    $("#gallery").sortable({
        revert: true,
        connectWith: "#trash",
        refreshPositions: true,

        // Newly added to change container background
        start: function(event, ui) {
            $("li.ui-state-highlight").text("place here"); 
            $(".containerTwo").stop().animate({"background-color":"#ffb9b9", "border-color":"#f06666", "border-top-style":"dashed", "border-right-style":"dashed", "border-bottom-style":"dashed", "border-left-style":"dashed",  "border-width":"1px"}, 500);
        }, 
        stop: function(event, ui) {
             $(".containerTwo").stop().animate({"background-color":"#fff", "border-color":"#aaa", "border-top-style":"solid", "border-right-style":"solid", "border-bottom-style":"solid", "border-left-style":"solid",  "border-width":"1px"}, 50);
        }
    });

    $("#trash").sortable({
        revert: true,
        connectWith: "#gallery",
        refreshPositions: true,

        // Newly added to change container background
        start: function(event, ui) {
            $("li.ui-state-highlight").text("place here"); 
            $(".container").stop().animate({"background-color":"#d4f7cd", "border-color":"#51965a", "border-top-style":"dashed", "border-right-style":"dashed", "border-bottom-style":"dashed", "border-left-style":"dashed",  "border-width":"1px"}, 500);
        }, 
        stop: function(event, ui) {
              $(".container").stop().animate({"background-color":"#fff", "border-color":"#aaa", "border-top-style":"solid", "border-right-style":"solid", "border-bottom-style":"solid", "border-left-style":"solid",  "border-width":"1px"}, 50);
        }