Hello,
J'ai remarqué un problème que j'ai avec les feuilles de style que je donne comme "alternative stylesheet" dans mes pages web. Le navigateur recalcule mal le contenu de la page quand la fonction javascript active la feuille de style. Je suis exactement ce qui est donné dans les différents liens (version javascript) de cette page http://forum.alsacreations.com/faq/#item12
Voici le code qui est dans mon header
La feuille de style global.css contient tout le look du site avec la taille de caractère par defaut. Les autres CSS surchargent simplement les styles de caractères pour changer la taille.
Mon idée du problème vient du fait que le code javascript qui est exécuté juste après les CSS va demander au navigateur de télécharger une CSS. Mais le temps que la CSS soit téléchargée, le navigateur a déjà commencé à faire le rendu de la page et il n'applique la nouvelle CSS qu'à la fin, sans recalculer correctement tout les blocs/espaces.
Est ce que quelqu'un a déjà remarqué ça? Si oui ... y a une solution en javascript ou pas?
La seule méthode que j'ai trouvé pour le moment est de rajouter la bonne CSS dans la page directement (sans passer par "alternate stylesheet") pour que le navigateur fasse un affichage correct donc rien en JS...
au lieu de
ou ce cas quand on clique sur le lien du menu, le texte se place correctement
Modifié par doykati (24 Oct 2006 - 09:59)
J'ai remarqué un problème que j'ai avec les feuilles de style que je donne comme "alternative stylesheet" dans mes pages web. Le navigateur recalcule mal le contenu de la page quand la fonction javascript active la feuille de style. Je suis exactement ce qui est donné dans les différents liens (version javascript) de cette page http://forum.alsacreations.com/faq/#item12
Voici le code qui est dans mon header
<link rel="stylesheet" type="text/css" href="global.css" media="screen,print"/>
<link rel="alternate stylesheet" title="small" type="text/css" href="small.css" media="screen"/>
<link rel="alternate stylesheet" title="large" type="text/css" href="large.css" media="screen"/>
<link rel="alternate stylesheet" title="larger" type="text/css" href="larger.css" media="screen"/>
<!-- ...code javascript... -->
La feuille de style global.css contient tout le look du site avec la taille de caractère par defaut. Les autres CSS surchargent simplement les styles de caractères pour changer la taille.
Mon idée du problème vient du fait que le code javascript qui est exécuté juste après les CSS va demander au navigateur de télécharger une CSS. Mais le temps que la CSS soit téléchargée, le navigateur a déjà commencé à faire le rendu de la page et il n'applique la nouvelle CSS qu'à la fin, sans recalculer correctement tout les blocs/espaces.
Est ce que quelqu'un a déjà remarqué ça? Si oui ... y a une solution en javascript ou pas?
La seule méthode que j'ai trouvé pour le moment est de rajouter la bonne CSS dans la page directement (sans passer par "alternate stylesheet") pour que le navigateur fasse un affichage correct donc rien en JS...
au lieu de
ou ce cas quand on clique sur le lien du menu, le texte se place correctement
Modifié par doykati (24 Oct 2006 - 09:59)