title: HTML: Turn off Drag and Drop Shadow/Ghost
body: <p>I would like to turn of the dragging-shadow that html's drag and drop shows by default. I saw this: <a href="http://www.kryogenix.org/code/browser/custom-drag-image.html" rel="nofollow">http://www.kryogenix.org/code/browser/custom-drag-image.html</a> for changing the image, but not completely removing the image. </p>
  
  <p>When i used this:</p>
  
  <pre><code>var dragIcon = document.createElement('img');
  dragIcon.src = '';
  dragIcon.width = 100;
  dragIcon.style.display = 'none';
  event.originalEvent.dataTransfer.setDragImage(dragIcon, -100, -100);
  </code></pre>
  
  <p>the ghost did dissapear, but i was no longer able to drag the image. This could have to do with me having to use angularJS as well...but there is no way around that anymore at this point.</p>
  
  <p><strong>Problem:</strong> 
  Move a div on a page that resizes ONLY the div right above itself dynamically (inside dragging function).</p>
  
  <p><strong>Question:</strong>
  I wanted to know if there is a way to turn off only the ghost, but keep all the rest of the functionality as is? This is most cosmetic than anything, but the ghost really does not add anything for me, since i am resizing everything on the fly.</p>
  
  <p>Any help would be appreciated. </p>