Experiment No 4

Asynchronous Image load

Aim

Show an asynchronous load for big images

Ingredients

Normal load

fries normal load

Asynchronous load

fries asynchronous load
Difference Image include
<img src="/img/fries.jpg" alt="fries normal load" class="async" />

<img src="/img/transparent.gif" data-src="/img/fries.jpg" alt="fries asynchronous load" class="async" />


$('img.async').each(function() {
 $(this).attr('src', $(this).data('src')).load();
});