Page 1 of 1

JavaScript CSS file switching...

Posted: Sun Oct 25, 2009 12:57 pm
by Wolf_22
pickle | Please use [ code=php ], [ code=text ], etc tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: :arrow: Posting Code in the Forums to learn how to do it too.


I have the following code that does NOT work in flavors of IE:

Code: Select all

window.onload = function(){setScreenClass();};window.onresize = setScreenClass;
 
function setScreenClass(){
    var w = document.documentElement.clientWidth;
    var h = document.documentElement.clientHeight;
    var w_class = (w<=240)?'w_240':(w>240&&w<=320)?'w_320':(w>320&&w<=640)?'w_640':(w>640&&w<=800)?'w_800':(w>800&&w<=1024)?'w_1024':(w>1024&&w<=1152)?'w_1152':(w>1152&&w<=1280)?'w_1280':'w_1600';
    //document.body.className=w_class+' '+h_class;
var h_class = (h<=600)?'h_600':(h>600 && h<=768)?'h_768':(h>768 && h<=800)?'h_800':(h>800 && h<=1024)?'h_1024':(h>1024 && h<=1280)?'h_1280':'h_1600';
    
    var styleNode = document.createElement('link');
    styleNode.setAttribute('rel', 'stylesheet');
    styleNode.setAttribute('type', 'text/css');
 
    if(w_class == 'w_1024'){
        styleNode.setAttribute('href', 'test.css');
    }else if(w_class == 'w_800'){
        styleNode.setAttribute('href', 'test.css');
    }
 
    //append other sheets to the conditions here...
 
    document.getElementsByTagName('head')[0].appendChild(styleNode);
};
What am I doing wrong here? I'm thinking it has to do with "setAttribute()" but I'm not sure what to replace it with--or even if that's really the true culprit. BTW, it works maybe two or three times in IE and THEN stops working, hence why I said it's not working in flavors of IE.


pickle | Please use [ code=php ], [ code=text ], etc tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read: :arrow: Posting Code in the Forums to learn how to do it too.

Re: JavaScript CSS file switching...

Posted: Mon Oct 26, 2009 1:56 pm
by pickle
IE has historically not had great support for DOM functionality. You'll need to do some error checking to see if a given method is supported, and use the IE equivalent if not.

Or just use library.