Reputation: 2636
$(document).ready(function () {
if ((screen.width >= 1024) && (screen.height >= 768)) {
alert('Screen size: 1024x768 or larger');
$("link[rel=stylesheet]:not(:first)").attr({
href: "style2.css"
});
} else {
alert('Screen size: less than 1024x768, 800x600 maybe?');
$("link[rel=stylesheet]:not(:first)").attr({
href: "style1.css"
});
}
});
I'm not getting this part: $("link[rel=stylesheet]:not(:first)").attr
Upvotes: 1
Views: 142
Reputation: 1052
Those are CSS selectors. In this particular example, all of the link tags whose rel values is "stylesheet" are being selected but the first one encountered will be omitted.
The following are pretty good for getting to grips with selectors:
W3Schools reference: http://www.w3schools.com/cssref/css_selectors.asp
Nettuts article: http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/
Upvotes: 1
Reputation: 91379
It selects all link
tags, that have an attribute named rel
, whose value is stylesheet
, and that is not the first one of the tags. For example, if you had:
<link rel="icon" />
<link rel="stylesheet" href="style2.css" />
<link rel="stylesheet" href="style3.css" />
<link rel="stylesheet" href="style4.css" />
The selector would pick the last two link
tags. Why? Because it excludes the first one, since the value of the rel
attribute is not stylesheet
, but icon
; and excludes the second one, because it's the first of all the link
s that have the attribute rel="stylesheet"
, and not(:first)
filters this one out.
Upvotes: 3
Reputation: 46
link[rel=stylesheet] will select all of the tags with attribute rel="stylesheet"
and :not(:first) will filter out the first one
Upvotes: 1
Reputation: 14620
$("link[rel=stylesheet]:not(:first)").attr({href : "style1.css"});
break it down into its parts. The selector in this case will match any <link>
element, that has a rel
attribute that equals stylesheet
, but it is :not
the (:first
) one it finds. When found. The Jquery attaches an href
attribute that equals the stylesheet for the browser window size... breathe
Upvotes: 1