jQuery Plugin To Display Fallback Image For Broken Images - smartImage

A smart and user-friendly image loading plugin which displays a placeholder image in case the current image fails to load and then replaces the placeholder with a fallback image after a specified number of attempts to re-load the original image.

How to use it:

1. Download and load the jQuery smartImage plugin's script after jQuery library as usual.

<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="js/jquery.smartImage.min.js"></script>

2. Create an img tag with empty src attribute on the webpage.

<img id="myImage" src="">

3. Call the function and specify the paths to original, placeholder and fallback images.

$('#myImage').smartImage({
  "load-image": 'original.jpg',
  "place-holder": 'loading.gif',
  "error-image": 'error.jpg'
});

4. Specify the number of attempts to re-load the original image.

$('#myImage').smartImage({
  "load-image": 'original.jpg',
  "place-holder": 'loading.gif',
  "error-image": 'error.jpg',
  "retry-max": 2
});

5. Specify the delay for each retry.

$('#myImage').smartImage({
  "load-image": 'original.jpg',
  "place-holder": 'loading.gif',
  "error-image": 'error.jpg',
  "retry-max": 2,
  "retry-delay": 3000
});

---

This awesome jQuery plugin is developed by essaricy. For more Advanced Usages, please check the demo page or visit the official website.