jquery - 拖动元素并滚动到顶部使元素保持在其位置，但光标会改变位置

Question

我将 Fullcalendar 与调度程序一起使用。当我尝试将事件从事件列表拖动到日历时 - 它工作正常，但是当我拖动它，然后使用滚动时 - 事件停留在您将其拖动到的位置，并且光​​标会根据滚动。所以，这是我的代码：

$('#external-events .fc-event').each(function() {
  // store data so the calendar knows to render an event upon drop
  $(this).data('event', {
    title: $.trim($(this).text()), // use the element's text as the event title
    stick: true // maintain when user navigates (see docs on the renderEvent method)
  });
  // make the event draggable using jQuery UI
  $(this).draggable({
    cursorAt: {
      left: 5,
      top: 5
    },
    zIndex: 999,
    refreshPositions: true,
    revert: true, // will cause the event to go back to its
    revertDuration: 0 //  original position after the drag
  });

});

#external-events {
  width: 100%;
  height: 850px;
  overflow-y: auto;
  overflow-x: hidden;
}

<script src="https://ajax.googleapis.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>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" />
<section id="calendar"></section>
<section id="external-events">
  <div class="fc-event event-to-drop">
    <p>Some content here</p>
  </div>
  <div class="fc-event event-to-drop">
    <p>Some content here</p>
  </div>
</section>

我尝试了我在互联网上找到的解决方案（用容器包装，并赋予它position: relative;样式、appendTo: 'body', helper: 'clone'属性等），但它对我没有帮助。我可以用其他方法来解决这个问题吗？谢谢。

标签： jqueryjquery-uifullcalendaroverflowdraggable