Problème HTML -- JavaScipt -- CSS Fermé

Question

Bonjour à tous et à toutes,

Mon problème est simple à expliquer ^^, est sera certainement durs à résoudre ><

alors voilà, je créer actuellement un Site internet, avec un choix multiple de design (pour l'instant 2)
le choix de design se fait par le choix de 2 boutons "radio" j'ai mit ce code là:

<FORM name="design">
 <INPUT type="radio" name="choix-design" value="black-design"  checked> Black Design
 <INPUT type="radio" name="choix-design" value="silver-design" > Silver Design
</FORM>

comme indiqué la case "Black Design" est coché par défaut, pour qu'il y est au moins un design d'utiliser
chaque design se réfère à un fichier CSS:

Black Design --> black-design.css
Silver Design --> silver-design.css

que j'ai mit sous cette forme dans mon site entre les balise HEAD:

 <LINK rel="stylesheet" media="screen" type="text/css" title="black-design" href="black-design.css">
 <LINK rel="stylesheet" media="screen" type="text/css" title="Silver-design" href="silver-design.css">

C'est la que mon problème se pose, car si on coche la case "Silver Design" le Design ne change pas, tous simplement car il faut créer un fichier JavaScript,
- Qui permettrais d'utiliser le fichier "silver-design.css" quand la case "Silver Design" est coché,
- Et qui permet d'utiliser le fichier "black-design.css" quand la case "Black Design" est coché,

de plus il faudrait que se choix s'enregistre dans un cookie pour que le visiteur du site puisse garder son design tout au l'on de sa visite, que l'on actualise ou que l'on change de page...

j'espère que vous pourrez m'aider, car je n'y connais rien en JavaScript, je n'est pas le temps de l'apprendre à un niveau assez approfondie pour faire ce genre de script [le site doit être fini pour le samedi de la semaine prochaine], et Google ne m'a pas permis de trouver un script déjà adapter ='(

Merci d'avance pour toutes les réponses qui pourrons m'aider =') ...
P.S: si vous voulez l'adresse de mon site, ou le code source du site ou des fichiers CSS dite le moi, si sa peut m'aider je ferais tout...

Typhon · Answer

UP --> je suis donc pas si nul que sa si personne ne peut m'aider ???

n'y aurais t-il personne qui sache comment ça marche ....

Utilisateur anonyme · Answer

Hello,

Je te suggérerais d'utiliser les cookies en PHP pour résoudre ton problème plutôt que le javascript.

Le principe est simple :

1/ Sur validation du formulaire de choix du Design, tu enregistre le choix de l'utilisateur dans un cookie de la manière suivante :

$_COOKIE["choix-design"] = setcookie("choix-design", $_POST["choix-design"],time()+60*60*24*30);

2/ Lorsque tu appelles ton CSS, tu passes en attribut href, la valeur de ton cookie, qui correspond en fait au nom du fichier css qui lui est associé

<LINK rel="stylesheet" media="screen" type="text/css" title="black-design" href="<?php $_COOKIE["choix-design"] ?>.css">

Typhon · Answer

Juste sa va me permettre de faire fonctionner le choix de design ??? j'ai juste à copier et à coller ??? [code] .css"> + .css"> et de mettre sa: $_COOKIE["choix-design"] = setcookie("choix-design", $_POST["choix-design"],time()+60*60*24*30) [/code] met les 2 balises links je les met par dessus mes anciennes ??? et le PHP je le met ou ???

Utilisateur anonyme · Answer

Une seule ligne suffit dans ton code HTML qui appelle ta feuille de style :

<LINK rel="stylesheet" media="screen" type="text/css" href="<?php $_COOKIE["choix-design"] ?>.css">

L'attribut "title" je pense n'est pas nécessaire.

La ligne de code PHP que je t'ai fournit doit être dans le fichier appelé par la méthode post de ton formulaire, que tu as au passage omis dant ton code fournit en exemple.

Donc en résumé:

1/ Tu compètes ton formulaire HTML de la manière suivante en ajoutant l'attribut action dans ta balise form :

<FORM name="design" action="setDesign.php">
<INPUT type="radio" name="choix-design" value="black-design" checked> Black Design
<INPUT type="radio" name="choix-design" value="silver-design" > Silver Design
</FORM>

2/ Dans un nouveau fichier PHP que tu nommes par exemple "setDesign.php", tu récupères et tu traites le choix de l'utilisateur de la manière suivante, en affectant au cookie, le design choisi par l'utilisateur en validant le formulaire :

$_COOKIE["choix-design"] = setcookie("choix-design", $_POST["choix-design"],time()+60*60*24*30)

3/ Dans chacune des pages de ton site, tu appelles la feuille de style CSS selon la valeur affectée au cookie. J'oubliais une chose, il est bon de tester si un cookie est définit ou non, si oui, la feuille de style appelée dépend de la valeur du cookie, sinon on charge la feuille de style par défaut, dans cet exemple : black-design.css

<?php
if(isset($_COOKIE["choix-design"]))
{
// Design choisis par l'utilisateur
$design = $_COOKIE["choix-design"];
}
else
{
// Design par défaut
$design = "black-design";
}
?>
<LINK rel="stylesheet" media="screen" type="text/css" href="<?php $_COOKIE["choix-design"] ?>.css">

Est-ce plus clair pour toi ?

Utilisateur anonyme · Answer

Est tu certain que ton offre d'hébergement te propose la possibilité de faire du PHP, dans le cas contraire, il est normal que ton navigateur te renvoie une erreur.

Par ailleurs, il est important de nommer tes pages avec l'extension PHP, afin que les serveur puisse les interpréter comme tel. exemple : index.php et non index.html.

Vérifie bien cela et dis moi ce qu'il en est

Typhon · Answer

Le problème et en faite dans cette phrase, a cause de la balise > le site lit la ligne comme sa:

<LINK rel="stylesheet" media="screen" type="text/css" href="<?php $_COOKIE["choix-design"] ?>

il croit que la balise link se ferme juste après le premier > et pas le deuxième, d'où le fait que sur ma page je lise .css"> en haut à gauche de ma page, il le bout du code n'est pas lut donc sa fausse tout, enfin je croit ^^ mais je ne suis pas expert...

pour l'instant le site n'est pas hébergé je le lit depuis mon ordinateur...

Utilisateur anonyme · Answer

Je crois voir d'où vient ton souci.

Pour tester des sites en PHP sur ton ordinateur tu dois installer PHP, et puisque PHP est nécéssairement installé sur un serveur, il te faut simuler un serveur local sur ta machine. 

Pour cela il te faut télécharger EasyPHP (tapes une recherche dans google), et déplacer l'arborescence de ton site dans le répertoire www du dossier d'installation une fois l'application installée.

Ensuite tu ouvres ton site via EasyPHP.

A ce moment là, ton navigateur est capable d'interpréter le PHP. et tu peux faire tes tests sur ta machine en local.

Typhon · Answer

ok je test et je te tient au courant :P

Typhon · Answer

Je sais pas pourquoi mais avec easyPHP sa change rien, j'ai installer, mit tout ce qui concerne mon site dans le répertoire www je ouvert mon accueil.php avec avec mozilla firefox et sa marche pas >< je voie toujours le bout de code qui apparait en haut à gauche de la page, alors j'ai tester mon site sur un hébergeur gratuit FreeHeberg là il bout de code n'apparait plus, j'étais content alors j'ai tester et sa à pas marché >< alors j'ai fait clique droit sur la page et Afficher le code source, et tout ce qui concerne le PHP à disparue de la page, je résume ce que j'ai pour être sur qu'il ne manque pas quelque chose: 5 fichier.php: - accueil.php - galerie.php - commande.php - livre-or.php chaque page du site on sa comme code entre les balise HEAD: Graph Addict | Site de Création Graphique .css"> et ce code là dans les balises BODY: - Design.php qui contient le code: $_COOKIE["choix-design"] = setcookie("choix-design", $_POST["choix-design"],time()+60*60*24*30) + 2 fichier CSS: - black-design.css - silver-design.css Alors ou est le problème ='( ...

Typhon · Answer

UP --> UP

Problème HTML --> JavaScipt --> CSS

10 réponses

Discussions similaires