Question

I am having a jQuery Script to find out the resolution of browser and then change its css.

if ((screen.width>=1024) && (screen.height>=768))
{
 alert('Screen size: 1024x768 or larger');
  $("link[rel=stylesheet]:not(:first)").attr({href : "detect1024.css"});
}
else
{
  alert('Screen size: less than 1024x768, 800x600 maybe?');
  $("link[rel=stylesheet]:not(:first)").attr({href : "detect800.css"});
}
});

can you please help me knowing its actual functioning?

what does :not(:first) mean ? Please explain.

Thanks.

Answer 1

actually it means you select every link element with the attribute rel matching the word stylesheet but exclude the first of the found results 🙂

so if you have three elements in a container and try to select them using :not(:first) you will receive the second and the third one but exclude the first (!) one

not sure if it that is what you want… but if you have more then one link attribute in header and all except the first are set to that href you might (!) end up having the CSS requested / checked against server / cache several times

Media queries (thirtydot’s comment) is also a good idea (comment +1)