Using JavaScript to assign a CSS file...

Ye' old general discussion board. Basically, for everything that isn't covered elsewhere. Come here to shoot the breeze, shoot your mouth off, or whatever suits your fancy.
This forum is not for asking programming related questions.

Moderator: General Moderators

Post Reply
Wolf_22
Forum Contributor
Posts: 159
Joined: Fri Dec 26, 2008 9:43 pm

Using JavaScript to assign a CSS file...

Post by Wolf_22 »

I currently use the unobtrusive JavaScript approach at handling dynamic placement or assignment of CSS classes to markup elements. This approach is found over on the A List Apart website.

What I have found (as far as my personal website is concerned) is that this won't cut it. I need the classes that the JavaScript creates to be used as conditional modifiers, where once triggered or tripped in the proceeding IF clauses, it will enact a corresponding CSS file for the given monitor resolution.

So in other words, I would like something like the following:

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';
    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';
 
    if(w_class = 'w_1024'){
        document.getElementById('css').href = 'w_1024.css';
    }elseif(w_class = 'w_1152'){
        document.getElementById('css').href = 'w_1024.css';
        }etc...
};
It's not working, however, and I was wondering if someone could explain to me why this is... Is it because it can't assign CSS files in the way I'm trying or is there simply something wrong with my syntax?
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: Using JavaScript to assign a CSS file...

Post by pickle »

I'm not sure the <link> tag can have an id. Usually when I see a script change the linked stylesheet, it adds and removes <link> tags, kind of like:

Code: Select all

$('head').append('<link rel = "stylesheet" type = "text/css" href = "1024.css" />);
 
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
Post Reply