The sticky scroll bar inside the draggable

jQuery UI draggable is so cool! However, if the draggable element (or any of its children) contains a scroll bar, clicking on it will result in the mouse pointer stuck on the whole draggable element forever. To avoid that, use the "cancel" option:

  2. $('#theDraggable').draggable({
  3. cancel: "input, textarea, .someClass"
  4. });

And it will work perfectly 🙂

At the time of this writing, I am using jQueryUI 1.8 version.