Changing color scheme

Im using the following code to change the color scheme of a website...

<img src="images/bg_green_box.gif" alt="" onclick="document.getElementById('bg_css').href='bg_green.css'" />
<img src="images/bg_blue_box.gif" alt="" onclick="document.getElementById('bg_css').href='bg_blue.css'" />
<img src="images/bg_peach_box.gif" alt="" onclick="document.getElementById('bg_css').href='bg_peach.css'" />

...with this between the head tags...

<link id="bg_css" rel="stylesheet" href="bg_green.css" type="text/css" />

... problem is the default color scheme, bg_green.css, will be loaded again once the user clicks on another page of the website. Is there a way for the site to remember which scheme was chosen as the user navigates through the site?

 

I think you have to modify css for that. If yo modify css you can change scheme of all the pages.

 

im giving the user the option to change the color scheme. problem is the color scheme goes back to default when user clicks to another page.

 

Just make a script that sets a cookie with the colorname in it. Then make a script that reads the cookie and adjusts the page according to the color set in the cookie

 

Problem Solved. Used the following...

<script type="text/javascript">
//<![CDATA[

window.onload = function(){
    if(document.cookie.match(/UseCss=(\w+)/) != null){
        document.getElementById('bg_css').href = 'bg'+RegExp.$1+'.css';
    }
    else{
        document.getElementById('bg_css').href = 'bg_green.css';
    }
}

function ChangeCss(toWhich){
    document.cookie = 'UseCss='+toWhich+';';
    document.getElementById('bg_css').href = 'bg'+toWhich+'.css';
}

//]]>
</script>

Code (markup):

 

i do that on this website: www homeindustry com.

i dynamically load CSS sheets for the main page based on a user cookie that I set when they make their selection. there is a default in the event that there is no cookie. then yes, you can call this cookie from any page where needed.