title: jQuery draggable item not visible
body: <p>I have a mistake in my code but I cant find out where it is since everything works properly in <a href="http://jsfiddle.net/YRfVd/66/" rel="nofollow noreferrer">js fiddle here</a> I use exactly the same code in jsfiddle as in my local files but when I run the page it only works there.<br></p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;link rel=&quot;stylesheet&quot; type=&quot;text/css&quot; href=&quot;style.css&quot;&gt;
      &lt;link rel=&quot;stylesheet&quot; href=&quot;https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css&quot;&gt;
      &lt;script src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js&quot;&gt;&lt;/script&gt;
      &lt;script src=&quot;https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js&quot;&gt;&lt;/script&gt;
      &lt;script type=&quot;text/javascript&quot; src=&quot;script.js&quot;&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt; 
  
  &lt;div id=&quot;draggableItem&quot;&gt;&lt;/div&gt;
  
  &lt;table border=&quot;1&quot;&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;&lt;/td&gt;
          &lt;td&gt;&lt;/td&gt;
      &lt;tr&gt;
      &lt;!-- snip here are some more columns like this, see jsfiddle for that--&gt;
  &lt;/table&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>js looks like this</p>
  <pre><code>$(document).ready(function (){
  $(&quot;#draggableItem&quot;).draggable({
      appendTo: &quot;body&quot;,
      helper: 'clone',
      revert: 'invalid'
  });
  
  $(&quot;td&quot;).droppable({
      tollerance: &quot;pointer&quot;,
      accept: &quot;#draggableItem&quot;,
      drop: function(event,ui){
          $(this).append($(ui.draggable).clone());
      }
  });
  </code></pre>
  <p>});</p>
  <p>In the end, there should be some kind of chess field and users should be able to drag a div into it (the <code>td</code> elements). On my local machine, the <code>draggableItem</code> becomes invisible as soon as I drag it and <code>tollerance: &quot;pointer&quot;</code> seems to be ignored completely. I have no idea why it works perfectly in JsFiddle but the same code doesn't show any animation and drop to wrong positions or doesn't drop anything at all. There are no errors in my console output and no differences in chrome, firefox or IE. I only see the animation from Draggable when I remove all options from it.<br><br>Has anyone an idea what I am doing wrong?<br>Thank you very much</p>