Stack Overflow fonctionne mieux avec JavaScript activé bannière

Question

J'essaie d'imiter la bannière Javascipt requise de ce site, et j'ai les divs ci-dessous qui sont cachés si javascript est autorisé/activé, mais je reçois un flash/apercevoir de la page charge.

<div id="Main_noJS">Craftystuff.com works best with JavaScript enabled</div> 
<div id="PartOfMain_noJS"><br /></div> 

CSS:

#Main_noJS { 
    width: 100%; 
    height: 23px; 
    font-family: Arial; 
    font-size: 111%; 
    color: White; 
    font-weight: bold; 
    background: #AE0000; 
    text-align: center; 
    padding-top: 4px; 
    position: fixed; 
    z-index: 100; 
} 

JavaScript:

// hide the "Craftystuff.com works best with JavaScript enabled" banner, if JavaScript is working 
if ($("#Main_noJS")) { 
    $("#Main_noJS").hide(); 
    // hide the spacer between the main content and banner... 
    $("#PartOfMain_noJS").hide(); 
} 

Ainsi, la bannière est visible pour commencer, et que lorsque javascript est activé dois-je cacher

• mais javascript doit prendre une seconde pour se mettre au travail pour cacher les choses ...

Je voudrais essayer d'arrêter les aperçus de la bannière, quand la page se charge d'abord, de l'aide?

Answer 1

Placez la bannière dans une balise <noscript>, documentée here.

<noscript> 
    <div>yada yada yada</div> 
</noscript> 

Answer 2

Vous pouvez simplement écrire sur une étiquette qui cache l'élément pendant le chargement de la page, il ne sera pas visible en attendant l'exécution du script:

<script>document.write('<div style="display:none;">');</script> 
<div id="Main_noJS">Craftystuff.com works best with JavaScript enabled</div> 
<script>document.write('</div>');</script>