JSFiddle - React, Tailwind, and code Playground
by taoist
HTML
<script src="http://jsplumb.googlecode.com/files/jquery.jsPlumb-1.3.16-all-min.js"></script>
<div id="window-a" class="plumb-window">Window A</div>
<div id="window-b" class="plumb-window">Window B</div>
<div id="window-c" class="plumb-window">Window C</div>
CSS
.plumb-window
{
float: left;
padding: 5px;
margin: 150px 20px 20px 20px;
background-color: #999;
}
JavaScript
jsPlumb.ready(function()
{
var win_a = jsPlumb.addEndpoint("window-a", { anchor:"TopCenter", maxConnections: -1, isSource:true, isTarget:true, dragAllowedWhenFull:true} );
var win_b = jsPlumb.addEndpoint("window-b", { anchor:"TopCenter", maxConnections: -1, isSource:true, isTarget:true, dragAllowedWhenFull:true} );
var win_c = jsPlumb.addEndpoint("window-c", { anchor:"TopCenter", maxConnections: -1, isSource:true, isTarget:true, dragAllowedWhenFull:true} );
jsPlumb.connect({source: win_b, target: win_a, detachable: true});
});