[jQuery/CSS - Accessibilité] display:none déprécié ?

Bonjour tout le monde,

Une simple question me turlupine depuis quelque temps, j'espère ne pas faire de doublons.

Je souhaite faire un effet d'apparition d'éléments en jQuery. La solution qui vient facilement en tête : mettre en display:none (ou opacity:0) l'élément, puis au document ready, faire un animate (ou show ..)

Le souci, c'est que ce n'est pas accessible : en effet, si on a pas de javascript activé, l'élément resteras forcément invisible.

Du coup, je fais autrement : je laisse en display block, au document ready je cache, puis je show.
Le souci ici, c'est que le temps que la page se charge, on peut apercevoir brièvement les éléments que je souhaite animer.

Là est donc la question : y a-t-il une solution alternative ? Ou dois-je garder la dernière ?

Merci !

C'est très classique, il suffit d'ajouter/retirer une classe au body dès le chargement de la page et ensuite d'ecrire les règles CSS qui vont bien.

.has-js #my-div{
     display:none;
}

Merci bien pour cette info

Le problème semble persister sous chrome, je vais voir pour optimiser l'affichage.

Merci !

Bonjour
Sur le même sujet : http://forum.alsacreations.com/topic-5-52070-1.html
Cela pourra peut-être t'aider.

Héhé merci, un simple

<script type="text/javascript"> 
		document.documentElement.className ="has-js" + document.documentElement.className; 
	</script> 

En début de page dans le head aura suffit. Merci !

Il manque un espace après has-js :

<script type="text/javascript">  
        document.documentElement.className ="has-js " + document.documentElement.className;  
    </script> 

;)