Javascript et css

Javascript et css - HTML/CSS - Programmation

Marsh Posté le 13-12-2004 à 17:33:47    

Bonjour :)
 
Etant débutant en programmation web (enfin, surtout avec javascript), j'ai fais quelques recherches concernant un sujet, mais je n'ai rien trouvé, donc j'espere que certaines d'entre vous pourrons m'aider  :)  
 
J'ai 2 styles css, chacun dans un fichier, et j'aimerais en cliquant sur 1 bouton, utilisé l'un ou l'autre style css.
J'aurais souhaité savoir si cela est possible avec javascript, vu que pour l'instant, j'ai du mal ...
 
Pour être plus précis, puis-je déclarer une variable "globale" dans mon doc HTML, la modifier lorsque je clique sur mon bouton (action onClik qui apelle une fonction javascript ou bien modifie la variable directement), et donc que cela "modifie" le style de page, sans recharger la page.
Et si c'est possible, comment ?  :pt1cable:  
 
Merci d'avance pour vos réponses  :jap:

Reply

Marsh Posté le 13-12-2004 à 17:33:47   

Reply

Marsh Posté le 13-12-2004 à 18:06:47    

à mon avis pas possible de podifier le CSS en cours sans recharger la page...
 
Et surtout, je suis meme pas sur que tu puisse le faire avec du JS, moi j'uitilise le PHP et les sessions pour ça (une bete variable de session $style_en_cours, que tu met à jour si le visiteur change)


---------------
- Xav - ...There are no crimes when there are no laws... -- Xav's World
Reply

Marsh Posté le 13-12-2004 à 18:12:19    

ut peux modifier le style d'un ou plusieurs élements avec du javascript mais je sais pas si c'est ce que tu veux


---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. |  Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.
Reply

Marsh Posté le 13-12-2004 à 18:26:04    

Salut,
 
http://msdn.microsoft.com/library/ [...] esheet.asp
Je ne sais pas dans quelle mesure c'est crossbrowser(je n'ai pas essayé) mais ca peut être un bon début...
 
Mieux :
http://www.alistapart.com/articles/alternate/
 
Bon courage

Reply

Marsh Posté le 13-12-2004 à 22:35:33    

Merci beaucoup pour votre aide  :)  
Finalement j'ai trouvé là:
http://www.monpremiersite.com/infoprat/
 
En bas à gauche on peux changer le style "presque" sans recharger, et le code javascript est tout simple:
 

Citation :

function setActiveStyleSheet(title) {
  var i, a, main;
  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;
    }
  }
}


 
et les lignes à mettre dans le HEAD:  

Citation :


<link rel="stylesheet" title="style1" type="text/css" media="screen" href="style/style1.css" />
<link rel="alternate stylesheet" title="style2" type="text/css" media="screen" href="style/style2.css" />
<style type="text/css">
</style>


 
et pour le changement explicite:

Citation :

  <a href="/infoprat/" onclick="setActiveStyleSheet('style1'); return false;" title="Style par defaut">Style 1</a>  
   <a href="/infoprat/" onclick="setActiveStyleSheet('style2'); return false;" title="Style sans logo d'entête">Style 2</a>


 
Le code avait l'air chaud au début (surtout que j'ai commencé le javascript samedi  :pt1cable: ), mais finalement c'est jouable, et ca fait ce que je veux :)
 
Merci à tous pour votre aide.   :jap:


Message édité par ikkyu_os le 13-12-2004 à 22:45:22
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed