Actualisation Perte du styleSheet

**jojo86** · 01/08/2011, 11h38

Bonjour,
Mon problème concerne uniquement IE sous FF aucun soucis.

Je fais une détection du navigateur en JS. Je viens donc ajouter dans le header la balyse styleSheet avec le lien et tout se qui vas avec.
J'utilise cette methode pour ajouter la balise :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
function SetCss(Lien) {
	var fileref=document.createElement("link");
	fileref.setAttribute("rel", "stylesheet");
	fileref.setAttribute("type", "text/css");
	fileref.setAttribute("href", Lien);
	document.getElementsByTagName("head")[0].appendChild(fileref);
}

Mon soucis, c'est que sous IE à l'actualisation de la page je perds le styleSheet (du moins c'est ce que j'en déduis car certains éléments disparaissent... Mais pas tous... c'est bisard).
Je vous donne un lien vers la page, en gros vous allez sur le site aucun soucis, vous pouvez naviguer en cliquant sur les différentes rubriques, mais si vous appuyez sur la touche F5 ou que vous actualisez, le fond du texte disparait...
Une explication?
http://georges86.free.fr/SiteFrancoise/Index.php
Merci beaucoup

**SpaceFrog** · 01/08/2011, 13h07

a quel moment colles tu ta balise lien pour le style ?

**jojo86** · 01/08/2011, 13h20

Salut,
Dans le header avec

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

window.onload

Si tu veux voir mon head :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<HTML>
<HEAD>
	<script type="text/javascript" src="Scripts/Navigateur.js"></script>
 	<script type="text/javascript" src="Scripts/NavBar.js"></script>
	<script type="text/javascript" src="contact/verification_formulaire.js"></script>
	<link rel="stylesheet" type="text/css" href="css/StyleEditor.css" /> 
<script type="text/javascript"> 
 window.onload = function() { Navigateur(); }
</script>
 
<!--[if IE 6]>
<script src="Scripts/DD_belatedPNG.js"></script>
<script>
	DD_belatedPNG.fix('ul, li, a');
</script>
<![endif]-->
 
<!--[if lte IE 8]>
<script type="text/javascript" src="Scripts/roundies.js"></script>
<![endif]-->
<style type="text/css">
	#navigation li a.H2E{color: rgb(255,242,75);}
	#navigation li a.H2E:hover{color: rgb(255,242,75);}
	</style>
</HEAD>

La fonction navigation fait partie du fichier Navigation.js déclaré précédemment.
La page charge bien le css mais après je ne comprends pas se qui se passe à l'actualisation...

Merci de votre aide.

**SpaceFrog** · 01/08/2011, 13h25

fais le sur le onload du body ?

**jojo86** · 01/08/2011, 14h35

J'avais testé et j'ai le meme problème...

**SpaceFrog** · 01/08/2011, 14h41

je ne vois pas le lien entre la fonction navigateurs et ton ajout de style ...

**jojo86** · 01/08/2011, 16h03

Le lien entre la fonction navigateur et le stylesheet c'est tout simplement que je charge un css pour IE et un css pour les autres navigateurs. J'ai donc besoin d'identifier le navigateur pour charger le bon fichier...

**SpaceFrog** · 01/08/2011, 16h23

oui cela je m'en doute bien ??,
la question est ou le fait la fonction navigateurs ?
ou se fait l'appel de l'inclusion ?

**jojo86** · 01/08/2011, 17h43

Voici mon script Navigateur.js :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function Navigateur(){
	var IE = false;
	var AUTRE = false;
	var intSplitStart = navigator.userAgent.indexOf("(",0);
	var intSplitEnd = navigator.userAgent.indexOf(")",0);
	var strChStart = navigator.userAgent.substring(0,intSplitStart);
	var strChMid = navigator.userAgent.substring(intSplitStart, intSplitEnd);
	var strChEnd = navigator.userAgent.substring(strChEnd);
	if ((strChMid.indexOf("MSIE 8") != -1) || (strChMid.indexOf("MSIE 7") != -1) || (strChMid.indexOf("MSIE 6") != -1)){
		SetCss("css/StyleIE.css");
	} else {
		SetCss("css/Style.css");
	}
}
 
function SetCss(Lien) {
	var fileref=document.createElement("link");
	fileref.setAttribute("rel", "stylesheet");
	fileref.setAttribute("type", "text/css");
	fileref.setAttribute("href", Lien);
	document.getElementsByTagName("head")[0].appendChild(fileref);
}

Pour voir ou se fait l'appel de cette fonction, voir le post #3

**jojo86** · 01/08/2011, 22h44

Je viens de vérifier et si j'inclus directement mon css dans le header (sans l’intégrer dynamiquement via javascript) et bien aucun soucis lors du refresh de la page...

Donc JS me fait des blagues sous IE...
SpaceFrog peut être que j'ai mal répondu à une de tes questions, si tu veux, détails moi plus la question et je t’expliquerais de mon mieux !

Merci,
Bonne nuité !

Actualisation Perte du styleSheet

JavaScript

Discussions similaires

Partager

Partager