DOCS API TESTS CONTACT GITHUB DISCUSS ISSUES
Window 1 disable
Window 2
Window 3
Window 4
Window 5
Window 6

#### SOURCES & TARGETS

This page provides a demonstration of the makeSource and makeTarget functions.

Drag Connections from the blue element to any of the green ones. You can also drag existing Connections from one green element to another - Connections are, by default, detachable (this behaviour can be overridden).

These functions provide an alternative means of setting up your UI to support draggable connections - here we treat entire elements as sources and targets, and only when Connections are established do we assign Endpoints for them.

The blue element is configured as a Connection source (and is not draggable), with a list of possible Anchor locations.

The 'disable' link is excluded from being a drag source through the use of the 'filter' parameter on the makeSource call.

The green elements are configured as Connection targets, with a "TopCenter" anchor, and are draggable

This demonstration uses jsPlumb 1.5.2, jQuery 1.9.0 and jQuery UI 1.9.2. For touch support, jQuery Touch Punch is used.