title: Is there a way to provide a fallback (local) image when the preferred (external/server/remote/cloud) image fails to load?
body: <p>I have anchor tags like so:</p>
  
  <pre><code>&lt;a href=\"http://www.duckbill.com" target=\"_blank\"&gt;&lt;img height=\"160\" width=\"160\" src=\"http://images.duckbill.com/PlatypiOnVacation.jpg\" alt=\"Platypi playing Pinochle and eating Pizza in Panama\" /&gt;&lt;/a&gt;
  </code></pre>
  
  <p>...that sometimes fail to load the src image; in such cases I'd like to, after a sufficient delay (a couple of seconds), replace that with:</p>
  
  <pre><code>&lt;a href=\"http://www.duckbill.com" target=\"_blank\"&gt;&lt;img height=\"160\" width=\"160\" src=\"Content/Images/PlatypiOnVacation.jpg\" alt=\"Platypi playing Pinochle and eating Pizza in Panama\" /&gt;&lt;/a&gt;
  </code></pre>
  
  <p>I know that I  could probably do that in jQuery, but how would I be able to programmatically determine that the remote file did not load and, when such is the case, respond by using the fallback image?</p>
  
  <h2>UPDATE</h2>
  
  <p>I like Brad Christie's answer for truly unavailable images, but I want to never show an "unavailable" - just use a local one if a remote one is not available at the moment. I like this: <a href="http://www.cirkuit.net/projects/jquery/onImagesLoad/example1.html" rel="noreferrer">http://www.cirkuit.net/projects/jquery/onImagesLoad/example1.html</a> but how to determine programmatically that the image failed?</p>