11548 sujets

JavaScript, DOM et API Web HTML5

Css('display','none').fadeIn(), qui marche

Salut coucou yo!

Je veux qu'un certain element de ma page s'affiche progressivement avec fadeIn() au chargement. Si je met l'element en display:none dans le CSS, les gens qui ont desactive JS ne pourront pas le voir! Donc j'effectue ce display:none avec jQuery aussi. Sauf qu'il y a un probleme avec cette solution: de temps en temps, l'element est visible pendant une fraction de seconde, le temps que le reste du DOM se charge, puis jQuery le fait disparaitre (display none) puis le fade in.

Je vois pas trop comment resoudre ce probleme. Une idee ?
Bien lu cet article Benjamin, tres intéressant. Mais je comprend pas comment je peux l'appliquer a un element normalement invisible que JS rend visible.
Essaye quelque chose comme ceci:
<!doctype html>
<meta charset="utf-8">
<title>Exemple</title>
<style>
  .js #page {display:none;}
</style>
<script src=http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js></script>
<script>
  $(document.documentElement).addClass("js");
  $(function(){
    $("#page").fadeIn();
  });
</script>
<div id="page">
  <!-- Contenu de ma page -->
</div>
Rendre l'element invisible avec jQuery au chargement de la page c'est deja ce que je fais ! Mais de temps en temps l'element peut etre vu brievement avant que jQuery le mette en display none Smiley ohwell
Sujet clos
Aller à