How to allow the choice of a theme in the site, through a css file and cache memory?

1

Alright? So I'm trying to create a system of individual theme choice on my site, and with that, I need to have it saved when the user chooses it, and all pages in the site load the css file containing the theme (yellow.css, blue.css), and whenever the user enters, the chosen theme is applied. I have tried to do a trick with a code that keeps a background, and displays it whenever the page is accessed, and with another code that causes the page to load a css file.

    if (localStorage.background) 
     document.body.background = localStorage.getItem("background");

    function bac(){
    localStorage.setItem("background", "img/14.png");
    document.body.background = "img/14.png";
    }

and

  function changeCSS(cssFile, cssLinkIndex) {
    var oldlink = document.getElementsByTagName("link").item(cssLinkIndex);

    var newlink = document.createElement("link");
    newlink.setAttribute("rel", "stylesheet");
    newlink.setAttribute("type", "text/css");
    newlink.setAttribute("href", cssFile);

    document.getElementsByTagName("head").item(0).replaceChild(newlink, oldlink);
  }
<a href="#" onclick="changeCSS('positive.css', 0);">STYLE 1</a>

What code should I use? Thanks in advance for your response.

    
asked by anonymous 27.07.2015 / 01:33

1 answer

0

You can save which theme was chosen by localStorage .

localStorage.setItem('tema', 'branco');

To recover the saved value use the localStorage.getItem

var tema = localStorage.getItem('tema');

    
27.07.2015 / 19:59