Normalmente no hago este tipo de pregunta / respuesta, pero pensé que lo haría, ya que he visto esta pregunta más de 20 veces, y no funciona una sola respuesta. En resumen, el problema es que si tiene contenido desplazable overflow: auto; en cualquier lugar dentro de un elemento jQuery arrastrable, cuando hace clic y arrastra la barra de desplazamiento, el contenedor arrastrable principal arrastra junto con él. Entonces, pasé un tiempo trabajando en una solución.

Aquí hay un ejemplo de algunos html que presentarían este problema:

<div class="draggable" style="width:100px;height:100px;">
  <div id="content" style="width:80px;height:80px;overflow:auto;">
    Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula ut id elit.
  </div>
</div>

La forma típica de inicializar un elemento para que se pueda arrastrar, es algo como esto:

$(".draggable").draggable()