title: partially downloaded images
body: <p>Hi I have some simple buttons that when clicked fire some js to add an image. My problem is and I'm not sure but might be to do with the internet connection is that every now and again the image will only partially download (see image). Once this has happened the partially downloaded image will be stored in the cache so you cannot click again to get the full image from the server. 
  All the images are good. What I need to know if possible is how to fix this. Firstly I have tried to detect when an image is only partially downloaded with <a href="http://desandro.github.io/imagesloaded/" rel="nofollow noreferrer">http://desandro.github.io/imagesloaded/</a> but this does not fire an error. Once I can detect the error I need to reload the image from the server not the cache.
  Sometimes in firefox the error "image corrupt or truncated" will show, all the images are good.</p>
  
  <p>Any help with these two points will be great thanks.</p>
  
  <p>JS: (I have tried to just change the src value but the same error happens)</p>
  
  <pre><code>        $('#Canvas_' + ParentName).empty().prepend('&lt;img '
           + 'class="' + Fabric 
           + '" match="' + that.attr('match') 
           + '" title="' + that.attr('title') 
           + '" cost="' + that.attr('cost') 
           + '" src="'+imgFolder+imgViews+imgSmall+that.parent().parent().attr('id') + '_' + that.attr('class').replace(toolRepalce, "") + '.' + that.parent().parent().attr('alt')
           + '" height="305px"'
           + ' width="645px" &gt;');
  </code></pre>
  
  <p><img src="https://i.stack.imgur.com/sgi4T.jpg" alt="partially downloaded image"></p>