Twitter iPhone pliant OnePlus 11 PS5 Disney+ Orange Livebox Windows 11

Choix de feuille de style par l'utilisateur ?

13 réponses
Avatar
kurtbosh
Bonsoir,

J'aimerais savoir comment est-il possible de donner le choix au
lecteur entre deux feuilles de style. Bien sur je peux mettre un lien
"Fond noir" ou "Fond blanc" mais cela oblige =E0 avoir deux fois la m=EAme
page avec juste les feuilles de style (externes) qui changent. Pour la
maintenance ce n'est pas top...

Je crois avoir vu quelque chose l=E0 dessus mais je sais plus o=F9 ?

Merci et bonne soir=E9e.

Guy

10 réponses

1 2
Avatar
SAM
Le 12/14/09 6:32 PM, kurtbosh a écrit :
Bonsoir,

J'aimerais savoir comment est-il possible de donner le choix au
lecteur entre deux feuilles de style. Bien sur je peux mettre un lien
"Fond noir" ou "Fond blanc" mais cela oblige à avoir deux fois la même
page avec juste les feuilles de style (externes) qui changent. Pour la
maintenance ce n'est pas top...

Je crois avoir vu quelque chose là dessus mais je sais plus où ?



par quelle méthode ?
PHP ?
Javascript ? (j'ai en stock et n'ai plus la provenance)

sinon il y a les FdS alternatives, mais je ne vois pas beaucoup de
brouteurs qui sachent les exploiter...
(iCab par exemple, et encore ? pas certain qu'il ne faille à chaque page
re-préciser laquelle on aime)

google : style switcher

--
sm
Avatar
Sergio
kurtbosh a écrit :
Bonsoir,

J'aimerais savoir comment est-il possible de donner le choix au
lecteur entre deux feuilles de style. Bien sur je peux mettre un lien
"Fond noir" ou "Fond blanc" mais cela oblige à avoir deux fois la même
page avec juste les feuilles de style (externes) qui changent. Pour la
maintenance ce n'est pas top...

Je crois avoir vu quelque chose là dessus mais je sais plus où ?



Un petit script PHP ou Javascript fera l'affaire...

Exemple en php :
---------------------------------------------------------
<?php // au début
$moi=$_SERVER['PHP_SELF'] ; // nom de la page

$set=$_GET['set'] ;
if($set!=2 && $set!=1) /* ici deux choix possibles */
{
$set=$_COOKIE['set'] ;
if ($set!=2) $set=1 ;
}
?>
<html>
<head>
<!-- ........ -->
<link rel="<?php if ($set!=1) echo 'alternate ' ?>stylesheet" type="text/css" media="screen" href="feuille1.css" title="normal">
<link rel="<?php if ($set!=2) echo 'alternate ' ?>stylesheet" type="text/css" media="screen" href="feuille2.css" title="alternatif">
<!-- ........ -->
</head>
<body>
<!-- ........ -->
<form action="<?php echo $moi ?>" method="get" id="switcher">
Choisir un habillage&thinsp;:
<select id="set" name="set">
<option value="1" <?php if ($set==1) echo 'selected="selected" ' ?>>Normal</option>
<option value="2" <?php if ($set==2) echo 'selected="selected" ' ?>>Alternatif</option>
</select>
<input type="submit" value="Ok"> <small>(ce choix n’influera aucunement sur l'impression)</small>
</form>



--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
Avatar
Sergio
Sergio a écrit :
kurtbosh a écrit :
Bonsoir,

J'aimerais savoir comment est-il possible de donner le choix au
lecteur entre deux feuilles de style. Bien sur je peux mettre un lien
"Fond noir" ou "Fond blanc" mais cela oblige à avoir deux fois la même
page avec juste les feuilles de style (externes) qui changent. Pour la
maintenance ce n'est pas top...

Je crois avoir vu quelque chose là dessus mais je sais plus où ?



Un petit script PHP ou Javascript fera l'affaire...

Exemple en php :



Et même sans PHP (ou javascript)...

Avec:
<link rel="stylesheet" type="text/css" media="screen" href="feuille1.css" title="normal">
<link rel="alternate stylesheet" type="text/css" media="screen" href="feuille2.css" title="alternatif">

Dans Firefox ou Opera, le menu "affichage/Style" permet de choisir la feuille de style.

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
Avatar
kurtbosh
Merci pour vos réponses !

Je préfèrerais en JS si c'est possible ?

Je ne suis pas certain que les utilisateurs connaissent l'existence de
l'option d'affichage que tu cites...

Guy
Avatar
SAM
Le 12/14/09 7:07 PM, Sergio a écrit :
kurtbosh a écrit :
Bonsoir,

J'aimerais savoir comment est-il possible de donner le choix au
lecteur entre deux feuilles de style. Bien sur je peux mettre un lien
"Fond noir" ou "Fond blanc" mais cela oblige à avoir deux fois la même
page avec juste les feuilles de style (externes) qui changent. Pour la
maintenance ce n'est pas top...



Un petit script PHP ou Javascript fera l'affaire...

Exemple en php :
---------------------------------------------------------
<?php // au début
$moi=$_SERVER['PHP_SELF'] ; // nom de la page



Oi, mais là, ça ne fonctionne que pour "cette" page
(et à condition qu'elle ait le form kivabien)
non ?

--
sm
Avatar
SAM
Le 12/14/09 7:46 PM, kurtbosh a écrit :
Merci pour vos réponses !

Je préfèrerais en JS si c'est possible ?

Je ne suis pas certain que les utilisateurs connaissent l'existence de
l'option d'affichage que tu cites...



En JS il suffit de faire changer entre les différentes FdS

<link rel="stylesheet" type="text/css" href="/css/styles.css"
title="Defaut">

<link rel="alternate stylesheet" type="text/css" href="/css/bleu.css"
title="Bleu">
<link rel="alternate stylesheet" type="text/css" href="/css/jaune.css"
title="Jaune">

<script type="text/javascript">
function setActiveStyleSheet(title) {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1
&& a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title) a.disabled = false;
}
}
}
</script>

</head><body>

<p>Changer de style :
<br>
<a href="#" onclick="setActiveStyleSheet('Defaut'); return false;">
normal</a>
<br>
<a href="#" onclick="setActiveStyleSheet('Bleu'); return false;"> bleu</a>
<br><a href="#" onclick="setActiveStyleSheet('Jaune'); return
false;"> jaune</a>
</p>



Mais toujours pas pour toutes les pages
(il faudra alors se servir des cookies)

--
sm
Avatar
kurtbosh
On 14 déc, 20:05, SAM
wrote:
Le 12/14/09 7:46 PM, kurtbosh a écrit :

> Merci pour vos réponses !

> Je préfèrerais en JS si c'est possible ?

> Je ne suis pas certain que les utilisateurs connaissent l'existence de
> l'option d'affichage que tu cites...

En JS il suffit de faire changer entre les différentes FdS

<link rel="stylesheet" type="text/css" href="/css/styles.css"
title="Defaut">

<link rel="alternate stylesheet" type="text/css" href="/css/bleu.cs s"
title="Bleu">
<link rel="alternate stylesheet" type="text/css" href="/css/jaune.c ss"
title="Jaune">

<script type="text/javascript">
function setActiveStyleSheet(title) {
    var i, a;
    for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
      if(a.getAttribute("rel").indexOf("style") != -1
         && a.getAttribute("title")) {
        a.disabled = true;
        if(a.getAttribute("title") == title) a.disabled = f alse;
      }
    }}

</script>

</head><body>

<p>Changer de style :
   <br>
<a href="#" onclick="setActiveStyleSheet('Defaut'); return false;">
normal</a>
   <br>
<a href="#" onclick="setActiveStyleSheet('Bleu'); return false;"> ble u</a>
   <br><a href="#" onclick="setActiveStyleSheet('Jaune'); return
false;"> jaune</a>
</p>

Mais toujours pas pour toutes les pages
(il faudra alors se servir des cookies)

--
sm



Cela me plait bien ta solution car ce sera du page par page.

Merci !

Guy
Avatar
SAM
Le 12/14/09 8:13 PM, kurtbosh a écrit :
On 14 déc, 20:05, SAM
wrote:
Le 12/14/09 7:46 PM, kurtbosh a écrit :

Je préfèrerais en JS si c'est possible ?



En JS il suffit de faire changer entre les différentes FdS



Cela me plait bien ta solution car ce sera du page par page.

Merci !



De rien,
une once de Google t'aurait donné la même exacte fonction
(je l'ai vue après) comme ici :
<http://my.opera.com/Groumphy/blog/index.dml/tag/styleswitcher&gt;
(il a dû copier la même source que moi, à croire ?)

Il est préférable aussi d'essayer d'avoir une FdS de base
et que celles 'bleu' et 'jaune' et peut-être 'defaut'
ne contiennent que le minima personnalisant la FdS principale
(afin de minimiser les chargements), éviter les redites de l'une à l'autre.

--
sm
Avatar
Sergio
SAM a écrit :

Un petit script PHP ou Javascript fera l'affaire...

Exemple en php :
---------------------------------------------------------
<?php // au début
$moi=$_SERVER['PHP_SELF'] ; // nom de la page



Oi, mais là, ça ne fonctionne que pour "cette" page
(et à condition qu'elle ait le form kivabien)
non ?



Ben, le FORM il est plus loin... dans la même page.
J'avoue avoir copié d'une de mes pages...

--
Serge http://leserged.online.fr/
Mon blog: http://cahierdesergio.free.fr/
Soutenez le libre: http://www.framasoft.org
Avatar
SAM
Le 12/15/09 10:21 AM, Sergio a écrit :
SAM a écrit :

Un petit script PHP ou Javascript fera l'affaire...

Exemple en php :
---------------------------------------------------------
<?php // au début
$moi=$_SERVER['PHP_SELF'] ; // nom de la page



Oui, mais là, ça ne fonctionne que pour "cette" page
(et à condition qu'elle ait le form kivabien)
non ?



Ben, le FORM il est plus loin... dans la même page.



Oui, oui, j'avais vu ;-)

J'avoue avoir copié d'une de mes pages...



As I did pour mon exemple en JS (le copié-collé c'est qd mme + sûr)

Ma question porte plus vers le développement : toutes pages

En JS on s'appuie sur les cookies pour que chaque nouvelle page chargée
puisse connaitre les préférences de l'utilisateur,
en PHP, j'imagine qu'on doit pouvoir faire de même
ou mieux : via sessions ? <-- là est mon interrogation.

--
sm
1 2