Css identique sur toute les pages

**snip74** · 31/12/2010, 12h24

Bonjour all et Bon réveillon,

j'ai une code CSS qui me permet de choisir le CSS voulu (rose.css ou style.css par défaut).
quand je laisse originale pas de souci mais quand une personne clic sur le CSS de couleur rose il y a que la page accueil qui change de CSS et quand elle change de page la page redeviens bleu (origine).

dans les meta j'ai mis :

et sur la barre du centre Changer de thème : Bleu Rose

Code :

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

1
2
3
4
<td width="19%"><div align="right">Changer de th&egrave;me :</div></td>
        <td width="9%"><div> 
		<a href="#" onclick="change_style('style.css'); return false;">Bleu</a> 
		<a href="#" onclick="change_style('rose.css'); return false;">Rose</a></div></td>

donc je voudrait savoir comment faire que toute les page reste rose ou bleu quand un clic dessus sans devoir a chaque fois cliquer dessus.

Cordialement Stéphane

**e-fitz** · 31/12/2010, 13h42

Bonjour,

donc ton code javascript change sur la page courrante le fichier css utilisé.

Par conséquent, quand l'utilisateur change de page le css reprend la valeur par défaut.

Si tu veux garder ta solution en javascript, tu devrais passer un paramètre dans l'url pour savoir quel est le style à utiliser.

Par exemple, une solution possible est de modifier les liens de ton menu quand tu changes de style.

Imaginons que tu aies ce lien dans ton menu :

Code :

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

1
2
 
<a href="news.php" id="news" >Ma page de news</a>

Maintenant ton lien pour changer le css :

Code :

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

1
2
 
<a href="#" onclick="change_style('rose.css'); changer_lien('rose'); return false;">Rose</a>

Et ton javascript changer_lien() serais quelque chose comme ca :

Code :

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

1
2
3
4
5
 
 
function changer_lien(css){
   document.getElementById('news').href += '?css=rose';
}

Ensuite dans le window.load de ta page il faut aussi une fonction disons auto_css() qui va récuperer le parametre css de l'url pour choisir le bon style (par exemple en appelant ta fonction change_style)

C'est une solution parmis d'autre, toutefois attention je n'ai pas tester le code il doit y avoir des petites erreurs

Bonne journée

**snip74** · 31/12/2010, 18h19

Bonsoir,
merci de la réponsse

donc j'ai testé le code et sa ne marche pas exemple si je passe de index.php a anim.php ou contact.php etc... la page reste bleu :/

et j'avais déja créer un code qui resemble fortement au tiens

META

Code :

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

<link title="tchat" type="text/css" rel="stylesheet" media="screen" id="link_style" href="style.css" />

Code :

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

1
2
3
4
5
<script type="text/javascript">
function change_style(style) {
document.getElementById('link_style').href = style;
}
</script>

Code :

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

1
2
3
<div>
<a href="#" onclick="change_style('style.css'); return false;">Bleu</a> 
<a href="#" onclick="change_style('rose.css'); return false;">Rose</a></div>

Cordialement Stéphane

Envoyé par e-fitz

Bonjour,

donc ton code javascript change sur la page courrante le fichier css utilisé.

Par conséquent, quand l'utilisateur change de page le css reprend la valeur par défaut.

Si tu veux garder ta solution en javascript, tu devrais passer un paramètre dans l'url pour savoir quel est le style à utiliser.

Par exemple, une solution possible est de modifier les liens de ton menu quand tu changes de style.

Imaginons que tu aies ce lien dans ton menu :

Code :

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

1
2
 
<a href="news.php" id="news" >Ma page de news</a>

Maintenant ton lien pour changer le css :

Code :

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

1
2
 
<a href="#" onclick="change_style('rose.css'); changer_lien('rose'); return false;">Rose</a>

Et ton javascript changer_lien() serais quelque chose comme ca :

Code :

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

1
2
3
4
5
 
 
function changer_lien(css){
   document.getElementById('news').href += '?css=rose';
}

Ensuite dans le window.load de ta page il faut aussi une fonction disons auto_css() qui va récuperer le parametre css de l'url pour choisir le bon style (par exemple en appelant ta fonction change_style)

C'est une solution parmis d'autre, toutefois attention je n'ai pas tester le code il doit y avoir des petites erreurs

Bonne journée

**e-fitz** · 31/12/2010, 19h33

Rebonsoir,

attention je n'ai pas tester le code il doit y avoir des petites erreurs

Donc il faut penser a rajouter les fonctions de chargement du param get pour bien mettre le bon css dans le window.load

Je me permet de le remettre car cette solution fonctionne, toutefois il faut l'avoir bien implémenté (ce qui n'est pas le cas dans le code que j'ai donné)

Bonne soirée

Css identique sur toute les pages

CSS

Vue hybride

Discussions similaires

Partager

Partager