Replace broken image with noimage icon using Jquery

Posted by hmloo on Geeks with Blogs See other posts from Geeks with Blogs or by hmloo
Published on Wed, 21 Mar 2012 06:23:55 GMT Indexed on 2012/03/21 11:30 UTC
Read the original article Hit count: 219

Filed under:

Sometimes when the image isn't available on server, the web page will show a broken image. so we can display a "no image available" image for good user experience. I will implement it using Jquery.

$(document).ready(function()
{
    $("img").error(function()
    {
        $(this).hide();
    })
    .attr("src", "noimage.jpg");
});

Please note that we must first hide the broken image, or else even if we set the src to noimage, it still can not show  noimage icon.

© Geeks with Blogs or respective owner