jsplumb issue 244
HTML
<script src="http://jsplumb.org/js/jquery.jsPlumb-1.3.8-all-min.js"></script>
<div id="one" class="grayContainer"></div>
<div class="emptyDiv"></div>
<div class="emptyDiv"></div>
<div class="emptyDiv"></div>
<div class="emptyDiv"></div>
<div class="emptyDiv"></div>
<div id="two" class="grayContainer"></div>
CSS
.grayContainer
{
background-color: #ececec;
min-height:80px;
width: 780px;
border: 1px solid, #bababa
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
padding: 10px;
margin-top: 15px;
margin-left: 25px;
margin-right: 12px;
margin-bottom: 12px;
}
.emptyDiv
{
min-height: 50px;
}
JavaScript
jsPlumb.ready(function() {
var conn = jsPlumb.connect({
source:"one",target:"two",
connector:"Straight",
anchors:["LeftMiddle", "LeftMiddle" ],
paintStyle:{
strokeStyle:"gray",
lineWidth:5,
gradient:{
stops:[[0,"green"], [1,"red"]]
}
}
});
$("div").bind("dblclick", function() {
conn.canvas
.childNodes[1]
.setAttribute("gradientUnits", "userSpaceOnUse");
});
jsPlumb.draggable($("div"));
});