makeDraggable()

This method makes an element draggable. You can directly pass the element reference or you can also a string value which can be any valid selector accepted by querySelector("").

Once the element is made draggable you can access the on( eventname: DragEventName, callback: DragEventCallback) this method will allow you to add event on your draggable element.

Please check Events Types for more information about draggable and droppable methods

Definition:

makeDraggable(element: Element | string | null, options?: DraggableOptions): DraggableElement

Description: Makes an element draggable with optional configuration settings.

Parameters:

  • element (Element | string | null) - The element or selector to make draggable.

  • options (DraggableOptions, optional) - Configuration options for draggable behaviour.

Returns:

  • DraggableElement - The element made draggable with a special "on" method attach with it.

Example:

// different ways to make a element draggable

// using class, id or any valid selector
const draggableItem = redropInstance.makeDraggable('#item1', draggableOptions);

// using element reference 
const element = document.getElementById("#item1")
const draggableItem = redropInstance.makeDraggable(element, draggableOptions);

Last updated