Class Draggable

A UI utility to make an element draggable.

Param: app

The Application that is being made draggable.

Param: element

A JQuery reference to the Application's outer-most element.

Param: handle

The element that acts as a drag handle. Supply false to disable dragging.

Param: resizable

Is the application resizable? Supply an object to configure resizing behaviour or true to have it automatically configured.

Param: resizable.selector

A selector for the resize handle.

Param: resizable.resizeX

Enable resizing in the X direction.

Param: resizable.resizeY

Enable resizing in the Y direction.

Param: resizable.rtl

Modify the resizing direction to be right-to-left.

Properties

position handlers _moveTime

Methods

activateListeners _activateDragListeners _activateResizeListeners _onDragMouseDown _onDragMouseMove _onDragMouseUp _onResizeMouseDown _onResizeMouseMove _onResizeMouseUp

Properties

position

position: Object

Duplicate the application's starting position to track differences

handlers

handlers: Object

Remember event handlers associated with this Draggable class so they may be later unregistered

_moveTime

_moveTime: number

Throttle mousemove event handling to 60fps

Methods

activateListeners

  • activateListeners(): void

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

    Returns void

Protected _activateDragListeners

  • _activateDragListeners(): void
  • Protected

    Attach handlers for dragging and floating.

    Returns void

Protected _activateResizeListeners

  • _activateResizeListeners(): void
  • Protected

    Attach handlers for resizing.

    Returns void

Private _onDragMouseDown

  • _onDragMouseDown(event): void
  • Private

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

    Parameters

    • event: any

    Returns void

Private _onDragMouseMove

  • _onDragMouseMove(event): void
  • Private

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

    Parameters

    • event: any

    Returns void

Private _onDragMouseUp

  • _onDragMouseUp(event): void
  • Private

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

    Parameters

    • event: any

    Returns void

Private _onResizeMouseDown

  • _onResizeMouseDown(event): void
  • Private

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

    Parameters

    • event: any

    Returns void

Private _onResizeMouseMove

  • _onResizeMouseMove(event): void
  • Private

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

    Parameters

    • event: any

    Returns void

Private _onResizeMouseUp

  • _onResizeMouseUp(event): void
  • Private

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

    Parameters

    • event: any

    Returns void

Settings

Member Visibility

Theme

On This Page

positionhandlers_moveTimeactivateListeners_activateDragListeners_activateResizeListeners_onDragMouseDown_onDragMouseMove_onDragMouseUp_onResizeMouseDown_onResizeMouseMove_onResizeMouseUp