Come posso cambiare il mio foglio di stile CSS usando jQuery?

Quello su cui sto lavorando è semplice.

Si fa clic su un pulsante (id="themes") e si apre un div (id="themedrop") che scorre verso il basso ed elenca i temi. (Ne ho solo due a questo punto)

 

Ora, quando il sito è caricato, viene caricato con style1.css (tema principale / originale)

  

Ora quello che sto cercando di capire è … Come posso averlo quando si fa clic sul pulsante della scala di grigi per cambiare il foglio di stile da style1.css a style2.css (nota: i file sono nella stessa directory)

Qualsiasi aiuto sarebbe molto apprezzato.

 $('#grayscale').click(function (){ $('link[href="style1.css"]').attr('href','style2.css'); }); $('#original').click(function (){ $('link[href="style2.css"]').attr('href','style1.css'); }); 

Fai un tentativo ma non sono sicuro che funzionerà, non l’ho provato ma ho avuto fortuna.

Ti suggerisco di dare il link -tag un id come tema. Inserisci il nome del file css in un data -attributo sui pulsanti e usa lo stesso gestore su entrambi:

html:

   

E js:

 $("button[data-theme]").click(function() { $("head link#theme").attr("href", $(this).data("theme")); } 

modo rapido per farlo è,

   

Usa questo :