Search code examples
jquerydraggablejquery-ui-draggablejquery-draggable

Draggable object - dragging from title

I have this HTML popup object enter image description here I made it draggable with jQuery. Now I can drag this popup from any point in the object, which causes problems with the scrolling - if I try to scroll by dragging the little rectangle inside the scrollbar - it drags the whole popup.

I want to make it possible to drag the popup only by dragging the title - so if I drag the title it will drag the whole popup, but I won't be able to drag the popup from any other point (the textarea, the white background, the scrollbar....)

Solution

  • You can use handles in Jquery UI

    If specified, restricts dragging from starting unless the mousedown occurs on the specified element(s). Only elements that descend from the draggable element are permitted.

    Eg:

    $( "your popup" ).draggable({
  handle: "title id"
});

    Refer handle