May
20
Dynamic CSS Loading with jQuery 1.4: Cross-Browser Problem Solved
May 20th, 2010 posted by admin
Add comments
Loading an external CSS stylesheet with jQuery is cake. But in version 1.4 it stopped working in IE. Specifically, doing this doesn’t work:
$('<link href="/path/to/stylesheet.css" rel="stylesheet" type="text/css" />').appendTo("head");
After investigating and Googling this a bit, I discovered that this technique does work:
var $link = $('<link/>').appendTo("head");
$link.attr({
href : "/path/to/stylesheet.css",
rel : "stylesheet",
type : "text/css"
});
However, this doesn’t work in Opera (only the latest version tested).
The solution is perhaps to simple to bother writing up, but here it is anyway:
$('<link href="/path/to/stylesheet.css" rel="stylesheet" type="text/css" />').appendTo("head");
$link.attr({
href : "/path/to/stylesheet.css",
rel : "stylesheet",
type : "text/css"
});
Subchild is a blog about web development. It's author is Aleksandar Kolundzija, himself a web developer
for 10++ years, presently a Hacker-in-Residence at betaworks. Prior to betaworks, Alex worked at Google, Meebo,
MLB Advanced Media (MLB.com), Razorfish, and elsewhere.