A UI utility to make an element draggable.

Constructors

Properties

The Application being made draggable.

element: HTMLElement

The Application's outer-most element.

handle: false | HTMLElement

The drag handle, or false to disable dragging.

handlers: Record<string, Function> = {}

Registered event handlers.

position: object = null

The Application's starting position, pre-drag.

resizable: boolean | DraggableResizeOptions

Resize configuration.

Accessors

  • get implementation(): typeof Draggable

    Retrieve the configured Draggable implementation.

    Returns typeof Draggable

Methods

  • Activate event handling for a Draggable application Attach handlers for floating, dragging, and resizing

    Returns void

  • Protected

    Attach handlers for dragging and floating.

    Returns void

  • Protected

    Attach handlers for resizing.

    Returns void

  • Protected

    Handle the initial mouse click which activates dragging behavior for the application

    Parameters

    • event: PointerEvent

    Returns void

  • Protected

    Move the window with the mouse, bounding the movement to ensure the window stays within bounds of the viewport

    Parameters

    • event: PointerEvent

    Returns void

  • Protected

    Conclude the dragging behavior when the mouse is release, setting the final position and removing listeners

    Parameters

    • event: PointerEvent

    Returns void

  • Protected

    Handle the initial mouse click which activates dragging behavior for the application

    Parameters

    • event: PointerEvent

    Returns void

  • Protected

    Move the window with the mouse, bounding the movement to ensure the window stays within bounds of the viewport

    Parameters

    • event: PointerEvent

    Returns void

  • Protected

    Conclude the dragging behavior when the mouse is release, setting the final position and removing listeners

    Parameters

    • event: PointerEvent

    Returns void