28173 sujets

CSS et mise en forme, CSS3

Salut la compagnie,
j'aimerai savoir comment je peux proposer a mes internautes de changer le design du site web... en cliquant sur differents boutons, sans faire plusieurs pages aux designs differents...
me suis je bien fait comprendre..lol
juste en changeant le css...
si possible sans PHP...
Merci bcp
Smiley cligne

PS: double post, dsl place plus apropriée ici, je serai plus attentif la prochaine fois promis Smiley ohwell
Modifié par popsantiago (23 Jun 2006 - 22:40)
Bonjour popsantiago et bienvenue,

La prochaine fois, il suffit de demander à un modérateur le déplacement du sujet.

C'est préférable au double post dans deux salons différents.
Smiley cligne Smiley smile

Pour répondre à ta question, l'un des avantages de css est justement la possibilité de changer le design d'une même page (sans toucher au code html)

Il existe un tutoriel assez simple à mettre un oeuvre, mais en php.

Pour ma part, je ne connais pas d'autre solution, ce qui ne veut pas dire qu'il n'y en a pas ...

Bonne chance

Smiley smile
Bonjour madame,
Smiley cligne
Vous ne m'y reprendrez plus.... promis.

ok, j'ai fouiné sur le net et j'ai trouvé!!!!!!!!!!
alors je mets tout pelle-mèle :

<head>
<link rel="stylesheet" type="text/css" href="site.css" title="style1"/>
<link rel="stylesheet" type="text/css" href="2site.css" title="style2" />
<script type="text/javascript" src="styleswitcher.js"></script>
</head>


dans body:

<a href="#" onclick="setActiveStyleSheet('style1'); return false;" title="Style1">Style1</a> <a href="#" onclick="setActiveStyleSheet('style2'); return false;" title="Style2">Style2</a>

et le fichier primordial :

a appeler === styleswitcher.js

function setActiveStyleSheet(title) {
var i, a, main;
for(i=0; (a = document.getElementsByTagName("link")); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title")) {
a.disabled = true;
if(a.getAttribute("title") == title) a.disabled = false;
}
}
}

function getActiveStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1 && a.getAttribute("title") && !a.disabled) return a.getAttribute("title");
}
return null;
}

function getPreferredStyleSheet() {
var i, a;
for(i=0; (a = document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("rel").indexOf("style") != -1
&& a.getAttribute("rel").indexOf("alt") == -1
&& a.getAttribute("title")
) return a.getAttribute("title");
}
return null;
}

function createCookie(name,value,days) {
if (days) {
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
}
else expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}

function readCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}

window.onload = function(e) {
var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);
}

window.onunload = function(e) {
var title = getActiveStyleSheet();
createCookie("style", title, 365);
}

var cookie = readCookie("style");
var title = cookie ? cookie : getPreferredStyleSheet();
setActiveStyleSheet(title);



Voila,

PS: j'avouerai que je ne suis pas allé tres loin, pour trouver ca, www.alsacreations.fr et hop vous verrez que le site propose par l'accessibilité de passer a des gros caracteres et hop la ca permet de changer de style...
J'adore alsacreation, on y trouve tout ce dont on a besoin, un grand merci encore a tout le monde, le forum et le(s) createur(s), d'ailleurs, j'ai acheté le bouquin CSS2 a la FNAC, c'est genial et utile!!!!
[/i][/i][/i]
Bonjour,

a écrit :
J'adore alsacreation, on y trouve tout ce dont on a besoin, un grand merci encore a tout le monde, le forum et le(s) createur(s), d'ailleurs, j'ai acheté le bouquin CSS2 a la FNAC, c'est genial et utile!!!!

Raphaël sera certainement touché de ces compliments Smiley biggrin mais il ferait sûrement une remarque du genre: AlsacréationSSSSSS !

Smiley cligne

Sinon ton sujet est-il résolu? Et pour les prochaines fois un petit rappel sur la présentation du code dans le forum.
Oki doki,
désolé pour l'orthographe de AlsacreationSSSSSS, un oubli...
C'est probléme résolu,
Encore merci,

Popsantiago