Я хотел бы использовать jQuery сортируемый пользовательский интерфейс в моем проекте. У меня есть n
количество панелей изображений в моем проекте. Каждая панель отображает список изображений, и пользователи имеют возможность перетаскивать изображение с одной панели на другую или на одну и ту же панель.
$(".sortCls").sortable({
connectWith: ".sortCls",
containment: "parent",
scroll: true,
appendTo: document.body,
helper: 'clone',
});
#mainItems {
overflow: auto;
width: 100%;
}
img {
height: 100px;
width: 100px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<div id="mainItems" class="darkScroll ui-sortable" style="height: 781px;">
<div id="dynamic02" style="height: 741.95px;">
<ul class="sortCls">
<li>
<img alt="Loading" src="//i.imgur.com/UqvDCwK.png">
</li>
<li>
<img alt="Loading" src="//i.imgur.com/UqvDCwK.png">
</li>
</ul>
</div>
<div id="dynamic03" style="height: 741.95px;">
<ul class="sortCls">
<li>
<img alt="Loading" src="//i.imgur.com/UqvDCwK.png">
</li>
<li>
<img alt="Loading" src="//i.imgur.com/UqvDCwK.png">
</li>
</ul>
</div>
</div>
Я использую jQuery версию библиотеки пользовательского интерфейса: 1.12.1
В моем проекте все работает нормально. Проблема заключается в том, что пользователь перетаскивает изображение и наводит курсор мыши на угол прокрутки браузера.