Jquery Сортировка по перетаскиванию

Question

Я использую jquery -ui sortable для перетаскивания элемента в несколько зон для удаления.

У меня есть несколько dropzone на div .left, и мне нужно использовать overflow-y, но когда я перетаскиваю элемент из левый div на правый div, элемент идет за правым div.

$('.dropzone').sortable({
        tolerance: 'pointer',
        connectWith: '.dropzone',
        placeholder: 'sortable-placeholder draggable',
        cancel: ":input, button, .disable-sort-item",
        scroll: true,
        scrollSensitivity: 10,
        scrollSpeed: 10,
        appendTo:"body",
        zIndex: 99999,
        start: function (event, ui) {
        },
        update: function( event, ui ) {         
        },
        receive: function( event, ui ) {         
        },
        sort: function(event, ui) {    
        },
        stop: function( event, ui ) {       
        },
        beforeStop: function(ev, ui) {

        },
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<div class="container">

    <div class="left-panel" style="overflow-y:auto; overflow-x:hidden;">
       <div class="dropzone" id="d1" style="">
          <div class= "draggable ui-sortable-handle">Elem Drag</div>
       </div>
       <div class="dropzone" id="d2" style=""></div>
       <div class="dropzone" id="d3" style=""></div>
       <div class="dropzone" id="d4" style=""></div>
    </div>


    <div class="right-panel" style="overflow:hidden;">
       <div class="dropzone" id="d5" style=""></div>
    </div>
    
</div>

Извините за мой плохой английский sh. ;)

Спасибо за помощь!