title: interact.js dragged item move on top
body: <p>it's my first time to use this plugin.</p>
  
  <p>I want to add a stacking of elements whenever it's dragged. I use z-index and position relative.</p>
  
  <pre><code>    onstart: function (event) {
  
      //get max z-index on page   
        var maxZ = Math.max.apply(null, 
        $.map($('body &gt; *'), function(e,n) {
          if ($(e).css('position') != 'static')
            return parseInt($(e).css('z-index')) || 1;
        }));
  
          event.target.style.background = 'red';
          event.target.style.zIndex = maxZ + 1; 
          event.target.style.position = 'relative'; 
      },
  </code></pre>
  
  <p>Is there more efficient way to do this?</p>
  
  <p><a href="http://interactjs.io/" rel="nofollow">original drag and drop demo</a></p>
  
  <p><a href="http://jsfiddle.net/juancoder/vz7ofxqt/embedded/result/" rel="nofollow">my edited drag and drop demo with stacking</a></p>