IE7 image charge quand il ne devrait pas

Question

Je construis un site, et une de mes pages pose un problème dans IE7. Vous pouvez voir le site ici: www.vitaminjdesign.com/contact.html

J'ai écrit un script jquery qui charge essentiellement une image de succès si les champs de contact ont une entrée, et une icône d'échec quand ils sont vides. Cela fonctionne parfaitement dans tous les navigateurs, mais dans IE7, un espace réservé d'image est chargé. Il ne disparaît pas tant que l'une des icônes n'est pas chargée. Il suffit de voir la page dans IE7 et vous verrez ce que je veux dire.

Je suis sûr qu'il existe un correctif CSS uniquement pour cela, mais comment puis-je supprimer ces images d'espace réservé dans IE7?

Voici mon jquery:

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

Answer 1

Vous pouvez définir display:none sur eux pour commencer, puis ajoutez $.show(); à la fin de votre Enchaînement dans le bind événement.

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

-

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

Answer 2

Donnez les images une image d'espace réservé.

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