Cette DIV n'est pas montrée sur Internet Explorer

Question

Je dois faire un certain message d'alerte (comme des validations, etc.), et je fais cela avec DIV.

Voilà comment je fais la validation:

<form action="index.php" method="post" onsubmit="return validateSearchKeyword();"> 
     <input class="text_search" id="text_search" name="text_search" type="text" value="pesquisar" onfocus="if (this.value=='pesquisar') this.value = ''" onBlur="if (this.value=='') this.value = 'pesquisar'" /> 
    </form> 

et la fonction de validation:

function validateSearchKeyword() 
{ 
if (document.getElementById('text_search').value==""){creatediv('divAvisoPesquisa','You must supply a value', '355px', '125px');return false;} 
} 

Cette fonction permet de créer la DIV:

function creatediv(id, html, left, top) { 

if (document.getElementById(id)) 
    { 
     //document.getElementById(id).style.display='block'; 
     //fadeIn(id, 300); 
    } 
    else 
    { 
     var newdiv = document.createElement('div'); 
     newdiv.setAttribute('id', id); 
     newdiv.setAttribute("class", "warningDiv"); 
     newdiv.style.position = "absolute"; 
     newdiv.innerHTML = html; 
     newdiv.style.left = left; 
     newdiv.style.top = top; 
     newdiv.style.display = "none"; 
     newdiv.onclick=function(e) { 
      $(this).fadeOut(300, function() { $(this).remove(); }); 
     }; 
     document.body.appendChild(newdiv); 
     $("#"+id).fadeIn(300); 
    } 
} 

Le fadIn et fadeOut fonctions sont de "jquery-1.3.1.min.js"

Le CSS ...

.warningDiv{ 
    -moz-border-radius-bottomleft:15px; 
    -moz-border-radius-bottomright:15px; 
    -moz-border-radius-topleft:15px; 
    -moz-border-radius-topright:15px; 
    font-size:11px; 
    font-weight:bold; 
    height:55px; 
    padding:15px 25px; 
    width:320px; 
    z-index:100000; 
    display: block; 
} 

Alors, que cela fonctionne très bien pour tous les navigateurs, à l'exception d'Internet Explorer. Même la validation fonctionne (le formulaire n'est pas soumis quand il ne passe pas la validation) mais le DIV n'est pas affiché. Comment puis-je résoudre ce problème?

Merci

Answer 1

Je pense que je l'ai. Il semble IE ne concerne pas les classes de la bonne façon si vous utilisez:

newdiv.setAttribute("class", "warningDiv"); 

Essayez d'utiliser ceci:

newdiv.className="warningDiv"; 

... Je viens de tester, et il montre toutes les propriétés CSS appropriées dans Barre d'outils développeur IE, qu'il ne faisait pas en utilisant le premier.

Answer 2

Je suis presque sûr .fadeIn de JQuery ne fonctionne pas sur IE6.

Essayez votre fonction sans l'effet de fondu ou modifier l'appel d'effet à ceci:

$("#"+id).fadeIn(300,function() { $(this).show(); });