jquery ui arrastrable desplazándose dentro del contenedor

Tengo una list desorderada y he agregado funcionalidad arrastrable a cada elemento de la list utilizando jquery ui draggable. la list está dentro de un div con id = "contenido". Aquí está la instantánea de mi list UL

enter image description here

Aquí está el código que he escrito:

<script src="../../jquery-1.8.0.js"></script> <script src="../../ui/jquery.ui.core.js"></script> <script src="../../ui/jquery.ui.widget.js"></script> <script src="../../ui/jquery.ui.mouse.js"></script> <script src="../../ui/jquery.ui.draggable.js"></script> <script type="text/javascript"> $(function() { $( ".draggable" ).draggable({ scroll: true, scrollSensitivity: 100, revert: true, containment: '#content', zIndex: 999990, revertDuration: 100, delay: 100 }); }); </script> <div style="width:200px;height:300px;overflow:auto;" id="content"> <ul> <li class="draggable">One</li> <li class="draggable">Two</li> <li class="draggable">Three</li> <li class="draggable">Four</li> <li class="draggable">five</li> <li class="draggable">six</li> <li class="draggable">Seven</li> <li class="draggable">Eight</li> <li class="draggable">Nine</li> <li class="draggable">Ten</li> <li class="draggable">Eleven</li> <li class="draggable">Twelve</li> <li class="draggable">Thirteen</li> <li class="draggable">Fourteen</li> <li class="draggable">Fifteen</li> <li class="draggable">Sixteen</li> <li class="draggable">Seventeen</li> <li class="draggable">Eighteen</li> <li class="draggable">Nineteen</li> <li class="draggable">Twenty</li> </ul> </div> 

Lo que me gustaría hacer es cuando estoy arrastrando cualquier elemento de la list dentro del contenedor (es decir, div con id = "contenido") y cuando el mouse está en el borde del borde div o tamaño, el contenedor también debe desplazarse para que yo podría moverse hacia arriba y hacia abajo dentro del contenedor.

Por ejemplo, si quería arrastrar el último elemento de la list de la list al primero de la list, así cuando el mouse esté en el extremo superior del borde div, el contenedor (en nuestro caso div) también debería desplazarse automáticamente. ¿Es esto un error en jquery ui draggable? Por favor ayuda

One Solution collect form web for “jquery ui arrastrable desplazándose dentro del contenedor”

Prueba a cambiar a jQuery 1.7.2

(No se supone que funcione con 1.8, pero creo. Puede encontrar la última versión compatible dentro del rar cuando descarga jQuery UI)

  • JQueryUI sortable: permite orderar solo a la segunda list pero no a la primera
  • Desactivar / Activar el intervalo de dates seleccionado en la interfaz de usuario jQuery datepicker
  • keycode 13 es para cual key
  • Convierta un formatting de date PHP a un formatting de date jQueryUI Datepicker
  • jQuery ui datepicker no funciona en Firefox
  • jQuery UI tolerancia orderable
  • jQuery.datepicker.formatDate y timezone offset
  • cómo verificar si el cuadro desplegable de autocomplete de jqueryUI estaba abierto
  • jQuery UI: Autocompletar: ¿cómo busco múltiples valores dentro de una matriz?
  • fuga de memory javascript en IE6 con plugin jquery ui básico
  • Cambiar mes y año no funciona en la window modal de arranque
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.