title: Extend jsplumb.draggable drag behavior
body: <p>I am sure that I am missing something here, but I would like to extend the drag behavior of a div with jsPlumb.draggable class attributes that is attached to an endpoint, while preserving the jsPlumb.draggable attributes. </p>
  
  <p>I would like something like this (adapted from this <a href="https://stackoverflow.com/questions/4903530/how-to-get-the-position-of-a-draggable-object">SO</a>): </p>
  
  <pre><code>$('#dragcodes').draggable(
      {
          drag: function(){
          var offset = $(this).offset();
          var xPos = offset.left;
          var yPos = offset.top;
          console.log('x: ' + xPos);
          console.log('y: ' + yPos);
      }
  });
  </code></pre>
  
  <p>on an element that is created using:</p>
  
  <pre><code>jsPlumb.draggable($(".dragcodes"));
  </code></pre>
  
  <p>Here is an <a href="http://jsfiddle.net/jimcrozier/jnPD5/1/" rel="nofollow noreferrer">example</a> of what I am trying to do. I want the top box to read the position out on drag like the bottom one is, but cannot figure out how to hack the drag: function in jsPlumb.draggable. The binding behavior <a href="https://stackoverflow.com/questions/17599321/get-position-of-target-after-dragstop">here</a> is getting close, but I want to target the div that is attached to the endpoint. If I override the drag: functionality, I lose the jsPlumb.draggable attributes. Thanks in advance for your help.</p>