IE7 image loads when it should not

I am building a site, and one of my pages is causing a bit of a problem in IE7. You can view the site here: www.vitaminjdesign.com/contact.html

I wrote a jquery script that basically loads a success image if the contact fields have an entry, and a fail icon when they are empty. It works perfectly in all browsers, but in IE7, an image placeholder is loaded. It doesnt dissapear until one of the icons is loaded. Just view the page in IE7 and you will see what I mean.

Im sure there is a CSS-only fix for this, but how do I remove those placeholder images in IE7?

Here is my jquery:

$开发者_JAVA技巧(function(){
    $(':text,:textarea').bind('change, blur',function(){
        $(this).next('img').attr('src',this.value ? 'success.png' : 'fail.png');
    });
});

You could set display:none on them for starters, and then add $.show(); to the end of your chaining within the bind-event.

<img id="myIcon" style="display:none" />

--

$(":text,:textarea").bind("change, blur", function(){
  $(this).next("img").attr("src",(this.value ? "success.png":"fail.png")).show();
});

Give the images a placeholder image.

<img id="myIcon" src="path/to/placeholder.png" />