Site internet HTML CSS

Fermé
knt88 - 16 mai 2012 à 17:20
mrHappy Messages postés 7 Date d'inscription mercredi 16 mai 2012 Statut Membre Dernière intervention 16 mai 2012 - 16 mai 2012 à 17:45
Bonjour,
Je suis actuellement entrain de réaliser un site web sur la contraception en HTML et CSS, ( je n'ai pas de connaissance en PHP, JavaS, ...
J'ai réalisé deux CSS que je voudrais impérativement placer sur mon site ( par exemple quand on clique sur un bouton tout le css change et met en place mon deuxieme CSS )
Or j'ai déja vu quelques bases en javascript ( mais je comprends rien ) donc si quelqu'un pourrait m'aider ( sans utiliser de java, ni php, ...) ca serait super sympa, sinon je prend aussi quelque chose en javascript

Merci d'avance


A voir également:

1 réponse

Bonsoir,
Sans javascript, le clic sur le bouton sera inactif (voir gestion d'évènement javascript...). Le HTML et le CSS ont leurs limites que le javascript permet de repousser...
0
et en javascript c'est vraiment compliqué de faire ca?
0
mrHappy Messages postés 7 Date d'inscription mercredi 16 mai 2012 Statut Membre Dernière intervention 16 mai 2012
16 mai 2012 à 17:45
Voici un exemple d'utilisation :

Votre fichier CSS
Créer plusieurs feuilles de styles que vous nommerez comme vous le désirez. Par exmple monCSS1.css, monCSS2.css...

Votre page html
Dans la partie head :


<link id="stylebase" rel="stylesheet" type="text/css" href="style/monCSS.css"/>

Votre fonction javascript
Dans la partie body de votre page :

(de préférence juste avant la balise </body> afin de permettre d'améliorer le temps de chargement de votre page, les éléments visuels étant d'abord chargé puis le Javascript, évitant ainsi de présenter une page toute blanche pendant quelques secondes) :

<script type="text/javascript">
function changeCss(i){
document.getElementById("styleDeBase").href="style/monCSS"+i+".css";
}

</script>

Vos boutons (pour changer les feuilles de style)
Dans la partie body :


<a href="#" onclick="javascript:changeCss(1)">Css 1</a> | <a href="#" onclick="javascript:changeCss(2)">Css 2</a>

Vous n'avez plus qu'à enregistrer la feuille de style CSS choisie dans un Cookie ou dans le profil de l'utilisateur si celui ci possède un compte sur votre site.
0