ansaurus

Question

Style switcher help

Answer 1

A:

Here is an HTML page that shows an example on how to add/remove styles dynamically.

<html>
<head>
    <title>add/remove style</title>
    <script>
        function removeStyle(id){
            var cs = document.getElementById(id);
            cs && cs.parentNode.removeChild(cs);
        }
        function addStyle(css, id){
            removeStyle(id);
            var styleNode = document.createElement("style");
            styleNode.setAttribute('type', 'text/css');
            styleNode.setAttribute('id', id);
            document.getElementsByTagName("head")[0].appendChild(styleNode);
            if(typeof styleNode.styleSheet !=='undefined'){
                styleNode.styleSheet.cssText = css; //IE
            }else{
                styleNode.appendChild(document.createTextNode(css));
            }
        }
    </script>
</head>
<body>
    <p>text to color</p>
    <input onclick="addStyle('p{color:#900}p{background:#DEF}', 'myStyle')" type="button" value="add style" >
    <input onclick="removeStyle('myStyle')" type="button" value="remove style">
</body>
</html>

Mic 2010-01-19 17:32:41

A Javascript solution is not feasible in this case.

Josh Stodola 2010-01-19 17:36:13

Why? Don't you get the css stream from a php call?

Mic 2010-01-19 18:40:47

Answer 2

A:

I've done this before, except differently. I had a link tag point to one handler (a file named getCss.php, for instance). Inside the handler, I have the cookie logic that will read the appropriate file and stream in the response with a content type of text/css. Then in the place where they pick a file, all you have to worry about is setting the cookie. It works very well and is easy to maintain.

Josh Stodola 2010-01-19 17:34:55

ansaurus

tags:

views:

answers:

Style switcher help

related questions